tmui-cli 2.0.3 → 2.0.5

package/data/uniappx/component/switch.md

@@ -0,0 +1,183 @@
+::: sourceCode
+## switch
+
+> 组件类型：UniSwitchElement 
+
+ 开关选择器
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 4.0 | 4.41 | 3.9 | 4.11 | 4.61 |
+
+### 属性 
+| 名称 | 类型 | 默认值 | 兼容性 | 描述 |
+| :- | :- | :- |  :-: | :- |
+| name | string |   | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 表单的控件名称，作为键值对的一部分与表单(form组件)一同提交 |
+| checked | boolean | false | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 当前是否选中，可用来设置默认选中 |
+| type | string |   | Web 4.0 / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 样式，有效值：switch, checkbox |
+| 合法值 | 兼容性 |
+| :- |  :-: |
+| switch | Web 4.0 / 微信小程序 4.41 / Android x / iOS x（部分支持，见上） |
+| checkbox | Web 4.0 / 微信小程序 4.41 / Android x / iOS x（部分支持，见上） |
+| ~~color~~ | string(string.ColorString) |   | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | switch 的颜色，同 css 的 color (使用foreColor替代) |
+| backgroundColor | string(string.ColorString) |   | Web 4.18 / 微信小程序 x / Android 4.18 / iOS 4.18 / HarmonyOS 4.61（部分支持，见上） | switch 的关闭状态背景颜色 |
+| activeBackgroundColor | string(string.ColorString) |   | Web 4.18 / 微信小程序 x / Android 4.18 / iOS 4.18 / HarmonyOS 4.61（部分支持，见上） | switch 的开启状态背景颜色 |
+| foreColor | string(string.ColorString) |   | Web 4.18 / 微信小程序 x / Android 4.18 / iOS 4.18 / HarmonyOS 4.61（部分支持，见上） | switch 的滑块背景颜色 |
+| activeForeColor | string(string.ColorString) |   | Web 4.18 / 微信小程序 x / Android 4.18 / iOS 4.18 / HarmonyOS 4.61（部分支持，见上） | switch 的开启状态下的滑块背景颜色 |
+| disabled | boolean | false | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | 是否禁用 |
+| thumb-class | string(string.ClassString) |   | Android(Vapor) 5.21 / iOS(Vapor) 5.11 / HarmonyOS(Vapor) 5.0（部分支持，见上） | 开关选择器滑块的类名 |
+| thumb-active-class | string(string.ClassString) |   | Android(Vapor) 5.21 / iOS(Vapor) 5.11 / HarmonyOS(Vapor) 5.0（部分支持，见上） | 开关选择器滑块选中的类名 |
+| switch-active-class | string(string.ClassString) |   | Android(Vapor) 5.21 / iOS(Vapor) 5.11 / HarmonyOS(Vapor) 5.0（部分支持，见上） | 开关选择器选中的类名 |
+| @change | (event: [UniSwitchChangeEvent](#uniswitchchangeevent)) => void |   | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 | checked 改变时触发 change 事件，event.detail={ value:checked} |
+
+type为checkbox只有微信小程序和Web平台支持。一般建议使用标准的[checkbox组件](checkbox-group.md)
+
+### 事件
+#### UniSwitchChangeEvent
+
+```mermaid
+graph LR
+  
+UniSwitchChangeEvent -- Extends --> UniCustomEvent&ltUniSwitchChangeEventDetail&gt
+  style UniCustomEvent&ltUniSwitchChangeEventDetail&gt color:#42b983
+  click UniCustomEvent&ltUniSwitchChangeEventDetail&gt "https://doc.dcloud.net.cn/uni-app-x/component/common.html#unicustomevent"
+```
+##### UniSwitchChangeEventDetail
+
+###### UniSwitchChangeEventDetail 的属性值
+| 名称 | 类型 | 必填 |
+| :- | :- | :- |
+| value | boolean | 是 |
+
+### 注意事项：
+- app-ios平台不支持padding style（padding-top、padding-left、padding-right、padding-bottom）
+
+### 暗黑模式
+
+App平台蒸汽模式从 5.25+ 起内置适配 switch 默认样式的暗黑模式。暗黑模式下，switch 未选中时轨道背景色为 `#3b3b3f`；选中时轨道背景色为 `#007aff`。
+
+### 示例
+示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/component/switch/switch.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/component/switch/switch.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/switch/switch
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/component/switch/switch
+
+>示例
+```vue
+<template>
+  <view class="uni-theme-root">
+    <view class="uni-padding-wrap uni-common-mt">
+      <view class="uni-title">默认样式</view>
+      <view class="flex-row">
+        <switch class="switch-checked" :checked="data.checked" @change="switch1Change" />
+        <switch @change="switch2Change" />
+      </view>
+      <view class="uni-title">暗黑样式</view>
+      <view class="flex-row">
+        
+        <switch id="darkChecked" background-color="#1f1f1f" activeBackgroundColor="#007aff" foreColor="#f0f0f0"
+          activeForeColor="#ffffff" :checked="data.checked" />
+        <switch id="dark" background-color="#1f1f1f" activeBackgroundColor="#007aff" foreColor="#f0f0f0"
+          activeForeColor="#ffffff" />
+        
+        
+        <switch id="darkChecked" :class="{ 'dark-class': !data.darkChecked1 }" switch-active-class="custom-switch-active" thumb-active-class="custom-thumb-active1" thumb-class="custom-thumb1" :checked="data.checked" @change="switch3Change" />
+        <switch id="dark" :class="{ 'dark-class': !data.darkChecked2 }" switch-active-class="custom-switch-active" thumb-active-class="custom-thumb-active1" thumb-class="custom-thumb1" @change="switch4Change" />
+        
+      </view>
+      <view class="uni-title">禁用样式</view>
+      <view class="flex-row">
+        <switch class="switch-checked" :checked="data.checked" :disabled="true" />
+        <switch :disabled="true" />
+      </view>
+      <view class="uni-title">不同颜色和尺寸的switch</view>
+      <view class="flex-row">
+        
+        <switch class="switch-color-checked" :color="data.color" style="transform:scale(0.7)" :checked="true" />
+        <switch class="switch-color" :color="data.color" style="transform:scale(0.7)" />
+        
+        
+        <switch switch-active-class="custom-switch-active-color" style="transform:scale(0.7)" :checked="true" />
+        <switch switch-active-class="custom-switch-active-color" style="transform:scale(0.7)" />
+        
+      </view>
+      <view class="uni-title">推荐展示样式</view>
+    </view>
+    <view class="uni-list">
+      <boolean-data :defaultValue="true" title="开启中"></boolean-data>
+      <boolean-data :defaultValue="false" title="关闭"></boolean-data>
+
+      
+      <view class="uni-list-cell uni-list-cell-padding">
+        <view class="uni-list-cell-db">自定义 thumb 样式</view>
+        <switch thumb-class="custom-thumb" thumb-active-class="custom-thumb-active"  />
+      </view>
+      
+    </view>
+
+    
+      <navigator class="uni-common-mb" url="/pages/template/switch-100/switch-100">
+        <button>组件性能测试</button>
+      </navigator>
+    
+  </view>
+</template>
+
+
+
+<style>
+  .flex-row {
+    flex-direction: row;
+  }
+
+  /* #ifdef VUE3-VAPOR && !MP */
+  .dark-class {
+    background-color: #1f1f1f;
+    border-color: #1f1f1f;
+  }
+
+  .custom-switch-active {
+    background-color: #007aff;
+    border-color: #007aff;
+  }
+
+  .custom-switch-active-color {
+    background-color: #FFCC33;
+    border-color: #FFCC33;
+  }
+
+  .custom-thumb-active1 {
+    background-color: #ffffff;
+  }
+
+  .custom-thumb1 {
+    background-color: #f0f0f0;
+  }
+
+  .custom-thumb {
+    background-color: #007aff;
+  }
+
+  .custom-thumb-active {
+    background-color: #e64340;
+  }
+  /* #endif */
+</style>
+
+```
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.form-component.switch)
+- [参见uni-app相关文档](https://uniapp.dcloud.io/component/switch.html)
+- [微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/component/switch.html)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=switch&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=switch&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=switch&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=switch&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=switch)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=switch&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)

package/data/uniappx/component/tap-gesture-handler.md

@@ -0,0 +1,36 @@
+::: sourceCode
+## tap-gesture-handler
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | 4.41 | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> | <a style="color:unset;" href="https://vote.dcloud.net.cn/#/?name=uni-app%20x">x</a> |
+
+### 属性 
+| 名称 | 类型 | 兼容性 | 描述 |
+| :- | :- |  :-: | :- |
+| tag | string | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(string)*<br/>声明手势协商时的组件标识 |
+| worklet:ongesture | eventhandler | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(eventhandler)*<br/>手势识别成功的回调 |
+| 合法值 | 兼容性 | 描述 |
+| :- |  :-: | :- |
+| state | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 手势状态 |
+| absoluteX | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 相对于全局的 X 坐标 |
+| absoluteY | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | 相对于全局的 Y 坐标 |
+| worklet:should-response-on-move | callback | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(callback)*<br/>手指移动过程中手势是否响应 |
+| worklet:should-accept-gesture | callback | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(callback)*<br/>手势是否应该被识别 |
+| simultaneous-handlers | Array.&lt;string&gt; | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(Array.&lt;string&gt;)*<br/>声明可同时触发的手势节点 |
+| native-view | string | Web x / 微信小程序 4.41 / Android x / iOS x / HarmonyOS x（部分支持，见上） | *(string)*<br/>代理的原生节点类型 |
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.wx.skyline.tap-gesture-handler)
+- [微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/component/tap-gesture-handler.html)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=tap-gesture-handler&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=tap-gesture-handler&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=tap-gesture-handler&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=tap-gesture-handler&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=tap-gesture-handler)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=tap-gesture-handler&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)

package/data/uniappx/component/text.md

@@ -0,0 +1,384 @@
+::: sourceCode
+## text
+
+> 组件类型：UniTextElement 
+
+ 文本
+
+### 兼容性 
+| Web | 微信小程序 | Android | iOS | HarmonyOS |
+| :- | :- | :- | :- | :- |
+| 4.0 | 4.41 | 3.9 | 4.11 | 4.61 |
+
+在app-uvue和app-nvue中，文本只能写在text中，而不能写在view的text区域。文本样式的控制也应该在text组件上写style，而不是在view的样式里写。
+
+虽然app-uvue中写在view的text区域的文字，也会被编译器自动包裹一层text组件，看起来也可以使用。但这样会造成无法修改该text文字的样式，详见uvue的[样式不继承](../css/README.md#stylenoextends)章节。
+
+### 属性 
+| 名称 | 类型 | 默认值 | 兼容性 | 描述 |
+| :- | :- | :- |  :-: | :- |
+| selectable | boolean | false | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS(VDOM) 4.61 / HarmonyOS(Vapor) 5.24 | 文本是否可选，蒸汽模式（Vapor）推荐使用user-select替换 |
+| space | string |   | Web 4.0 / 微信小程序 - / Android(VDOM) 3.9 / Android(Vapor) x / iOS(VDOM) 4.11 / iOS(Vapor) x / HarmonyOS(VDOM) 4.61 / HarmonyOS(Vapor) x（部分支持，见上） | 显示连续空格，App平台蒸汽模式（Vapor）已废弃此属性 |
+| 合法值 | 兼容性 | 描述 |
+| :- |  :-: | :- |
+| ensp | Web 4.0 / Android 3.9 / iOS(VDOM) 4.11 / iOS(Vapor) x / HarmonyOS(VDOM) 4.61 / HarmonyOS(Vapor) x（部分支持，见上） | 中文字符空格一半大小 |
+| emsp | Web 4.0 / Android 3.9 / iOS(VDOM) 4.11 / iOS(Vapor) x / HarmonyOS(VDOM) 4.61 / HarmonyOS(Vapor) x（部分支持，见上） | 中文字符空格大小 |
+| nbsp | Web 4.0 / Android 3.9 / iOS(VDOM) 4.11 / iOS(Vapor) x / HarmonyOS(VDOM) 4.61 / HarmonyOS(Vapor) x（部分支持，见上） | 根据字体设置的空格大小 |
+| decode | boolean | false | Web 4.0 / 微信小程序 - / Android(VDOM) 3.9 / Android(Vapor) x / iOS(VDOM) 4.11 / iOS(Vapor) x / HarmonyOS(VDOM) 4.61 / HarmonyOS(Vapor) x（部分支持，见上） | 是否解码，App平台蒸汽模式（Vapor）已废弃此属性 |
+| user-select | boolean | false | Web x / 微信小程序 4.41 / Android(VDOM) x / Android(Vapor) 5.11 / iOS(VDOM) x / iOS(Vapor) 5.11 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.24（部分支持，见上） | 文本是否可选，Web平台该属性会使文本节点显示为 inline-block，App平台弹出"复制"菜单 |
+| hover-class | string(string.ClassString) | "none" | Web x / 微信小程序 x / Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.11 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.0（部分支持，见上） | 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 |
+| hover-stop-propagation | boolean | false | Web x / 微信小程序 x / Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.11 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.0（部分支持，见上） | 指定是否阻止本节点的祖先节点出现点击态(祖先节点：指根节点到该节点路径上的所有节点都是这个节点的祖先节点) |
+| hover-start-time | number | 50 | Web x / 微信小程序 x / Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.11 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.0（部分支持，见上） | 按住后多久出现点击态，单位毫秒 |
+| hover-stay-time | number | 400 | Web x / 微信小程序 x / Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.11 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.0（部分支持，见上） | 手指松开后点击态保留时间，单位毫秒 |
+| max-lines | number |   | Web x / 微信小程序 x / Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.11 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.0（部分支持，见上） | 文本的最大行数，默认不限制最大行数 |
+| flatten | boolean | false | Web x / 微信小程序 x / Android(VDOM) x / Android(Vapor) 5.21 / iOS(VDOM) x / iOS(Vapor) 5.11 / HarmonyOS(VDOM) x / HarmonyOS(Vapor) 5.0（部分支持，见上） | 是否拍平组件 |
+
+### hover-class
+App平台蒸汽模式（Vapor） `text` 组件新增支持 `hover-class` 实现点击态效果。
+
+**注意**
+- 蒸汽模式（Vapor）子 `text` 组件不支持 hover 相关功能
+- VDOM模式 `text` 组件不支持 hover 相关功能
+
+### 空白字符
+`空白字符`并不只是指空格键敲出来的那个`空格`字符，它是一个字符集合。
+包括以下字符：
+- 普通空格 (Space): (ASCII 32)
+- 制表符 (Tab): \t (ASCII 9)
+- 换行符 (Line Feed): \n (ASCII 10)
+- 回车符 (Carriage Return): \r (ASCII 13)
+
+空白字符的处理分为 编译期处理 和  运行期处理 两个阶段。
+
+#### 编译期处理
+编译期间仅处理template中直接写在text节点中的静态文本，如下示例1：
+```uvue
+<template>
+  <text id="t1"> a   bc def	g
+hi </text>
+</template>
+```
+编译期间会将template中静态文本的所有空白字符转换为空格，并将多个连续空格合并为一个空格，首尾空格保留。
+如上示例1编译后text组件中的文本内容为“ a bc def g hi ”。
+
+注意：编译期间不会处理变量中的空白字符。
+
+#### 运行期处理
+由 `space` 属性 和 [white-space](../css/white-space.md) 样式共同决定。
+- `space` 属性：仅处理空格字符
+- [white-space](../css/white-space.md)样式： 处理所有空白字符
+
+如下示例2，演示text组件使用变量中的文本：
+```uvue
+<template>
+  <text>{{text}}</text>
+</template>
+
+```
+>上面代码中的 \t 和 \n 是 `转义字符`，\t 表示 制表符 (Tab)，\n 表示 换行符 (Line Feed)
+
+编译期间不会对变量中的空白字符做处理，而是由各平台运行环境根据 [white-space](../css/white-space.md) 样式处理并渲染。
+
+**space属性**
+如果text组件配置了space属性值，会先根据space属性值处理文本中的空格，再根据 [white-space](../css/white-space.md) 样式处理。
+蒸汽模式（Vapor）废弃了space属性。推荐统一改用css white-space来处理空白字符。
+
+**App-Android、App-iOS平台**
+HBuilderX5.0版本开始 app-andorid/app-ios平台调整 [white-space](../css/white-space.md) 样式控制空白字符处理逻辑与 W3C 规范一致，
+默认值为 `keep`。
+如上示例2中将保留所有空格（连续空格不会合并）、制表符、换行符进行渲染，a和b之间有3个空格。
+
+app-andorid/app-ios平台避免使用 `space` 属性处理空格，存在以下平台差异：
+- app-android平台配置了 `space` 属性将只处理空格转换，忽略 white-space 样式值，即按 white-space: keep 处理。
+- app-ios平台配置了 `space` 属性将先处理空格转换，再根据 white-space 属性值处理空白字符。
+后续统一会废弃 	`space` 属性，推荐统一改用css white-space 来处理空白字符。
+
+**App-Harmony平台**
+蒸汽模式（Vapor） [white-space](../css/white-space.md) 样式控制空白字符处理逻辑与 W3C 规范一致，默认值为 `keep`。
+
+**Web平台**
+HBuilderX5.0版本开始 web平台调整 [white-space](../css/white-space.md) 样式控制空白字符处理逻辑与 W3C 规范一致，
+默认值为 `pre-line`。
+如上示例2中将合并空格（连续空格合并为1个空格），制表符转换为空格，保留换行符进行渲染，a和b之间只有1个空格。
+
+uni-app x中有text组件，这是一个web没有的组件。且uni-app x在非web平台，包括小程序平台，都不支持<br>换行，所以uni-app x设计为text组件中的`\n`默认不会忽略，而是换行。
+
+不管app平台默认值keep，还是web平台默认值pre-line，都是这个表现。
+
+web的默认值preline，虽然支持\n换行，同时会合并\n以外的其他多个连续空白字符为1个。这是web与app的不同。app为了提升性能，默认值为keep，即默认不会合并连续的空白字符。
+
+### 实体字符
+`实体字符`（Entity Character）是在标记语言（如 vue/uvue 的 template 中）或编程中，用来表示那些具有特殊含义、无法直接输入或显示的字符的一种编码方式。
+实体字符通常由三部分组成，以 &开头，以 ;结尾，中间是实体名称或编号。
+常见的实体字符包括：
+- 空格	(space)：&amp;nbsp;，实体编号表示为 &amp;#160;
+- 小于号(<)：&amp;lt;，实体编号表示为 &amp;#60;
+- 大于号	(>)：&amp;gt;，实体编号表示为 &amp;#62;
+- 和号	(&)：&amp;amp;，实体编号表示为 &amp;#38;
+- 引号	(")：&amp;quot;，实体编号表示为 &amp;#34;
+- 版权符号(©)：&amp;copy;，实体编号表示为 &amp;#169;
+- 注册商标(®	)：&amp;reg;，实体编号表示为 &amp;#174;
+
+实体字符的处理分为 编译期处理 和  运行期处理 两个阶段。
+
+#### 编译期处理
+某些字符在标记语言中是预留的。例如，template会将 < 视作标签的开始。如果想在文本上显示“5 < 10”，直接输入 < 可能会导致编译器误以为后面跟着一个标签，从而引起编译报错，这时需要使用`实体字符` &amp;lt; 表示 <，如下示例：
+```uvue
+<template>
+  <text id="t1">5 &lt; 10</text>
+</template>
+```
+编译期间会将template中静态文本的所有实体字符解析为真实字符。
+如上示例编译后text组件中的文本内容为“5 < 10”。
+
+注意：编译期间不会处理变量中的实体字符。
+
+#### 运行期处理
+由 `decode` 属性值决定是否在运行期解析实体字符，默认运行期不解析实体字符。
+
+如下示例，演示text组件使用变量中的文本：
+
+```uvue
+<template>
+  <text decode="false">{{text}}</text>
+</template>
+
+```
+
+编译期间不会对变量中的实体字符做转换，而是由各平台运行环境根据 `decode` 属性值决定是否转换。
+- `decode` 属性值设置为 true 时：运行期转换实体字符，上面示例字符串显示为 “5 < 10”
+- `decode` 属性值设置为 false 时：运行期不转换实体字符，上面示例字符串显示为 “5 &amp;lt; 10”
+
+**注意**
+蒸汽模式（Vapor）将废弃 `decode` 属性，运行期不再解析实体字符。
+
+### 子组件 @children-tags
+| 子组件 | 兼容性 |
+| :- | :- |
+| [text](text.md) | Web 4.0 / 微信小程序 4.41 / Android 3.9 / iOS 4.11 / HarmonyOS 4.61 |
+
+text组件在web浏览器渲染（含浏览器、小程序webview渲染模式、app-vue）和uvue中，可以并只能嵌套text组件。
+
+app平台 text 组件虽然支持嵌套，但注意限制：
+1. 子组件不继承父组件样式。这样使用会在编译到web渲染的平台时产生差异。
+2. 子组件设置的排版相关样式（如position、display、width、height、margin、padding等）以及部分text独有样式（如text-align、lines、white-space、text-overflow）不生效
+3. 嵌套时建议将文本写在`<text></text>`标签之间，例如：`<text><text>嵌套文本1</text><text>嵌套文本2</text></text>`，避免出现预期外的效果。
+
+HBuilderX4.51版本起 text组件嵌套时，子组件支持点击事件响应。之前版本如有这方面需求，请改用 [rich-text](./rich-text.md)
+
+### 示例
+示例为[hello uni-app x alpha分支](https://gitcode.com/dcloud/hello-uni-app-x/blob/prod_alpha/pages/component/text/text.uvue)，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例[另见](https://gitcode.com/dcloud/hello-uni-app-x/blob/master//pages/component/text/text.uvue) 
+::: preview https://hellouniappx.dcloud.net.cn/web/#/pages/component/text/text
+
+> appRedirect https://hellouniappx.dcloud.net.cn/appredirect.html?path=pages/component/text/text
+
+>示例
+```vue
+<template>
+  
+  <scroll-view class="uni-theme-root" style="flex: 1">
+  
+    <page-head :title="title"></page-head>
+    <view class="text-page uni-padding-wrap uni-common-mt uni-theme-root">
+      
+      <text class="uni-title-text">单行文本</text>
+      <view class="text-box">
+        <text class="styled-text single-line">{{ singleLineText }}</text>
+      </view>
+      <text class="uni-subtitle-text">单行文本 - 拍平</text>
+      <view class="text-box" flatten>
+        <text class="styled-text single-line" flatten>{{ singleLineText }}</text>
+      </view>
+
+      
+      <text class="uni-title-text">多行文本</text>
+      <view class="text-box">
+        <text class="styled-text">{{ multiLineText }}</text>
+      </view>
+      <text class="uni-subtitle-text">多行文本 - 拍平</text>
+      <view class="text-box" flatten>
+        <text class="styled-text" flatten>{{ multiLineText }}</text>
+      </view>
+
+      <text class="uni-title-text">嵌套的text样式合集</text>
+      <text class="uni-common-mt uni-common-mb">
+        <text class="styled-text">text嵌套text的内容：</text>
+        <text class="styled-text">{{multiLineText}}</text>
+      </text>
+
+      
+      <text class="uni-title-text">自定义组件：右边拍平</text>
+      <view class="view-row">
+        <child></child>
+        <child flatten></child>
+      </view>
+
+      
+      <text class="uni-title-text">动态文本</text>
+      <view class="dynamic-text-box">
+        <text class="text">{{ text }}</text>
+      </view>
+      <text class="uni-subtitle-text">动态文本 - 拍平</text>
+      <view class="dynamic-text-box" flatten>
+        <text class="text" flatten>{{ text }}</text>
+      </view>
+      <view class="uni-btn-v">
+        <button class="uni-btn" type="primary" :disabled="!canAdd" @click="add">
+          add line
+        </button>
+        <button class="uni-btn" type="warn" :disabled="!canRemove" @click="remove">
+          remove line
+        </button>
+        <button class="uni-btn" type="primary" @click="textProps">
+          更多属性示例
+        </button>
+        
+        <button class="uni-btn" type="primary" @click="textWriter">
+          打字机效果示例
+        </button>
+        
+        
+        <button class="uni-btn" type="primary" @click="textLayout">
+          文本测量
+        </button>
+        
+      </view>
+      
+      <navigator url="/pages/template/4050/4050">
+        <button class="uni-btn uni-common-mb">组件性能测试</button>
+      </navigator>
+      
+    </view>
+  
+  </scroll-view>
+  
+</template>
+
+
+
+<style>
+  .view-row {
+    flex-direction: row;
+    background-color: var(--list-background-color, #ffffff);
+    justify-content: space-around;
+  }
+  .text-box {
+    margin-bottom: 15px;
+    padding: 10px;
+    display: flex;
+    min-height: 60px;
+    background-color: var(--list-background-color, #ffffff);
+    justify-content: center;
+    align-items: center;
+  }
+
+  /* 包含所有文字和排版CSS的综合样式 */
+  .styled-text {
+    /* 文字专用CSS */
+    /* 字体相关 */
+    font-size: 16px;
+    font-weight: 500;
+    font-style: italic;
+    color: var(--text-color, #1a1a1a);
+    /* 行高与字间距 */
+    line-height: 1.8;
+    letter-spacing: 1px;
+    /* 对齐 */
+    text-align: left;
+    /* 文字装饰 */
+    text-decoration-line: underline;
+    /* 文本阴影 */
+    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
+    /* 排版CSS */
+    width: 100%;
+    margin: 5px 0;
+    padding: 8px 12px;
+    border: 1px solid var(--border-color, #e0e0e0);
+    border-radius: 4px;
+    background-color: var(--active-background-color, #f9f9f9);
+  }
+
+  /* 单行文本特定样式 */
+  .single-line {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    text-align: center;
+  }
+
+  .dynamic-text-box {
+    margin-bottom: 15px;
+    padding: 10px;
+    display: flex;
+    min-height: 50px;
+    background-color: var(--list-background-color, #ffffff);
+    border: 1px solid var(--border-color, #dddddd);
+    border-radius: 5px;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .text {
+    font-size: 14px;
+    color: var(--text-color, #353535);
+    line-height: 22px;
+    text-align: center;
+  }
+</style>
+
+```
+
+::: warning 注意
+App 端不支持 `text` 组件中渲染多段文本，如果 `text` 组件中的文本是动态的，可以将计算后的结果通过数据给到 `text` 组件, 而不是在模板中通过 `template` 拼接多段文本, 以免出现渲染异常。
+
+错误写法：
+```vue
+<template>
+  <view>
+    <text>
+      <template v-for="item in list">
+        <template v-if="item['show']">{{item['text']}}</template>
+      </template>
+    </text>
+  </view>
+</template>
+
+```
+
+正确写法：
+```vue
+<template>
+  <view>
+    <text>{{textValue}}</text>
+  </view>
+</template>
+
+```
+
+### 参见
+- [相关 Bug](https://issues.dcloud.net.cn/?mid=component.basic-content.text)
+- [参见uni-app相关文档](https://uniapp.dcloud.io/component/text.html)
+- [微信小程序文档](https://developers.weixin.qq.com/miniprogram/dev/component/text.html)
+- [支付宝小程序文档](https://open.alipay.com/portal/zhichi/search?keyword=text&pageIndex=1&pageSize=10&source=doc_top&type=all)
+- [百度小程序文档](https://smartprogram.baidu.com/forum/search?query=text&scope=devdocs&source=docs)
+- [抖音小程序文档](https://developer.open-douyin.com/search-page?keyword=text&secondType=all&type=1)
+- [飞书小程序文档](https://open.feishu.cn/search?from=header&page=1&pageSize=10&q=text&topicFilter=)
+- [钉钉小程序文档](https://open.dingtalk.com/search?keyword=text)
+- [QQ小程序文档](https://q.qq.com/wiki/develop/miniprogram/frame/)
+- [快手小程序文档](https://developers.kuaishou.com/page?keyword=text&from=docs)
+- [京东小程序文档](https://mp-docs.jd.com/doc/dev/framework/-1)
+- [华为快应用文档](https://developer.huawei.com/consumer/cn/doc/quickApp-References/webview-frame-overview-0000001124793625)
+- [360小程序文档](https://mp.360.cn/doc/miniprogram/dev/#/b770a184ff1f06c6b3393a0fd1132380)
+
+## max-lines
+
+多行文本设置最大行，目前在web规范中，需使用临时规范-webkit-line-clamp，并搭配display: -webkit-box。
+
+App平台在VDOM模式时使用了自定义的css属性lines，在蒸汽模式下改成了text的max-lines组件属性。
+
+使用max-lines属性时，不需要写 `display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;`。如果你需要兼容web，可以写在web的条件编译中。
+
+web和小程序的text组件暂未支持max-lines组件属性，后续计划蒸汽模式的全平台text组件都将支持max-lines属性，并在web和小程序上编译为-webkit写法。
+
+## Bug & Tips@tips
+- app-Android平台和app-iOS VDOM平台 selectable开启后，仅支持全部文字复制，暂不支持自由调整光标选择文字。如需自由选择文字，请使用[rich-text组件](rich-text.md)。web平台默认就是可复制文字的，selectable无效。
+- web平台4.86版本起text组件调整为display:block，嵌套text组件时，子text默认display为inline。此前版本无论父子均为inline。如无必要请勿覆盖text的display样式，以免出现预期外的效果。