原始内容 rawContent

原始内容即通过 PHP 原始的方式输出到页面的内容，包括手动 echo 和在 PHP 代码外部直接定义的 HTML。

用法

在 zin 部件结构中，通过调用 rawContent 方法，可以将原始内容作为 HTML 插入到调用 rawContent 方法所属的部件内，并遵从插入的顺序。

简单使用

下面为一个简单示例：

zin 声明

<?php
h1
(
    'Hello zin!',
    setClass('zin-title')
);

btn
(
    'Run',
    on::click('run')
);

div
(
    /* 声明在 div 中渲染页面上的原始内容 */
    rawContent()
)
?>

<style>
.zin-title {color: var(--color-primary-800);}
</style>

<script>
function run()
{
    alert('Run zin!');
}
</script>

<?php render('div');?>

生成的 HTML

<h1 class="zin-title">Hello zin!</h1>
<button onclick="run">Run</button>
<div>
  <style>
  .zin-title {color: var(--color-primary-800);}
  </style>
  <script>
  function run()
  {
      alert('Run zin!');
  }
  </script>
</div>

最佳实践

• 通常只能在一个 zin 视图内调用一次 rawContent 方法，否则原始内容会在每次调用的位置被重复插入，除非你确认需要这样的效果。
• 如果内容被渲染在 页面 page、对话框 modalDialog、片段 fragment 内时，已经在默认块位置末尾插入了 rawContent()，因此不需要再次调用，如果确实需要手动调用，需要设置 rawContent 属性为 false。

只渲染原始内容

极端情况下，你可以不额外声明任何其他 zin 部件，全部使用原始内容，下面为一个极端的示例：

<?php $message = '可能存在潜在风险。'; ?>
<div class="alert warning-pale flex items-center">
  <i class="icon icon-warning-sign icon-2x alert-icon"></i>
  <div>
    <h4 class="font-bold text-lg big-title">注意！</h4>
    <p><?php echo $message;?></p>
    <button type="button" class="btn primary" onclick="learnMore">了解更多</button>
  </div>
</div>

<style>
.big-title {color: var(--color-primary-800);}
</style>

<script>
function learnMore()
{
    alert('Learn more!');
}
</script>

提示

上例中没有显式调用 render 方法，故会调用默认的无参数的 render() 方法，该方法会渲染默认块位置的内容，即 rawContent() 方法的内容。

属性

该组件没有属性。