spz-data-source 数据源

• 需要在页面中统一管理数据来源，供 spz-render 等子组件使用时。
• 需要展示单个商品、商品列表、专辑商品、最近浏览商品或推荐商品时。
• 需要多个数据源嵌套，子数据源从父数据源中读取条目数据时。

通过 source-type 指定数据类型，配合 source-id 传入资源 ID，内部放置 spz-render 渲染数据内容。

<spz-data-source
  id="spz-data-source-base"
  layout="container"
  source-type="product"
  product-data='[{"title":"经典白色T恤","price":"¥199","emoji":"👕"},{"title":"休闲牛仔裤","price":"¥399","emoji":"👖"},{"title":"运动跑鞋","price":"¥599","emoji":"👟"},{"title":"时尚帆布包","price":"¥149","emoji":"👜"}]'
  items="data"
>
  <spz-render
    id="product-list-render"
    layout="container"
    binding="spz-data-source-base"
  >
    <template>
      <div class="product-grid">
        <div spz-for="item in data" class="product-card">
          <div class="product-card-img">${item.emoji}</div>
          <div class="product-card-body">
            <div class="product-card-name">${item.title}</div>
            <div class="product-card-price">${item.price}</div>
          </div>
        </div>
      </div>
    </template>
  </spz-render>
</spz-data-source>