示例
这里收集了一些常用的 template-sdk 使用示例,帮助你快速上手。
基础示例
基础使用
最简单的基础使用示例,包含配置定义、插件安装和取值
入门字段类型
展示所有支持的字段类型:string、number、boolean、image、video、array
配置媒体字段
图片和视频字段的使用方法,以及如何访问媒体对象属性
媒体数组字段
数组字段的定义和取值,包括嵌套数组和数组操作
进阶完整项目示例
代码片段
简单文本显示
<script setup>
import { useTemplateValue } from 'template-sdk'
const title = useTemplateValue('title', '默认标题')
</script>
<template>gt;
<h1>{{ title }}</h1>
</template>
图片展示
<script setup>
import { useTemplateValue } from 'template-sdk'
const poster = useTemplateValue('poster', null)
</script>
<template>gt;
<img :src="poster?.url" :alt="poster?.alt" />
</template>
循环列表
<script setup>
import { useTemplateValue } from 'template-sdk'
const features = useTemplateValue('features', [])
</script>
<template>gt;
<ul>
<li v-for="feature in features" :key="feature.key">
{{ feature }}
</li>
</ul>
</template>