Cuttlefish Docs
  • 简体中文

    • src 属性用法

    通常需要通过接口请求数据的组件元素都支持 src 属性。但每个组件支持的用法也不一样，有些组件都支持，有些只支持部分用法。它有以下三种形式的用法：

    API

    一个请求可以返回数据的URL。

    <spz-render layout="container" src="/api/products/productID">
  <!-- ... -->
</spz-render>

    本地数据

    通过 JSON 类型的脚本来获取本地的数据。

    <script id="render-json" type="application/json">
  {
    <!-- ... -->
  }
</script>

<spz-render layout="container" src="script:render-json">
  <!-- ... -->
</spz-render>

    spz-script

    通过 spz-script 导出的函数来获取数据，在该元素中数据可以从接口中请求返回，也可以是本地数据。

    <spz-script id="custom-script">
  function getData() {
    /* ... */
    return Promise.resolve({/* ... */})
  }

  exportFunction('getData', getData);
</spz-script>

<spz-render layout="container" src="spz-script:custom-script.getData">
  <!-- ... -->
</spz-render>

    AI 使用建议（LLM Ready）

    • 章节密度：检测到 0 个二级标题。
    • 示例密度：检测到 3 个代码块。
    • 先读结论：优先提取本页“定义、约束、边界条件”。
    • 再读证据：根据代码示例确认可执行写法，不直接依赖自然语言段落。
    • 最后联动：涉及组件时同步查看对应组件页，避免文档与实现偏差。