spz-text 文本

支持国际化的文本组件，可根据当前语言环境自动渲染对应的翻译内容，并支持插槽变量替换

布局

container

何时使用

需要展示支持多语言的文本内容时。
文本中包含动态变量（如数量、金额）需要在运行时替换时。
需要根据 Section 的翻译配置自动切换展示文本时。

代码演示

基本用法

通过 translationid 指定翻译键，组件会自动从当前 Section 的语言包中获取对应文本；使用 slot-text-* 和 slot-currency-* 前缀属性传入变量，文本中的 {变量名} 占位符会被自动替换。

欢迎使用 spz-text 组件

该组件支持多语言国际化，可根据当前语言环境自动替换文本内容。

共 {count} 件商品，合计 {price}

<div class="demo-text-wrap">
  <spz-text layout="container" translationid="title">欢迎使用 spz-text 组件</spz-text>
  <spz-text layout="container" translationid="desc">该组件支持多语言国际化，可根据当前语言环境自动替换文本内容。</spz-text>
  <spz-text layout="container" translationid="price_tip" slot-text-count="3" slot-currency-price="99.00">共 {count} 件商品，合计 {price}</spz-text>
</div>

属性

属性名	说明	类型	默认值	是否必需
translationid	语言包中对应的翻译键名	string	-	否
slot-text-*	文本类型插槽变量，`*` 为占位符名称，例如 `slot-text-count="3"` 会替换文本中的 `{count}`	string	-	否
slot-currency-*	货币类型插槽变量，`*` 为占位符名称，值会被渲染为 `spz-currency` 组件，例如 `slot-currency-price="99.00"` 会替换文本中的 `{price}`	string	-	否