更新CSS示例

pages/CSS/text/text-overflow.uvue

@@ -3,15 +3,16 @@
     <view style="height: 250px;padding: 0 30px; background-color: gray;justify-content: center;">
       <view class="margin-bottom-10">
         <text class="font-weight-bold">text-overflow:clip white-space:nowrap</text>
-        <text class="font-size-20" style="text-overflow: clip;white-space: nowrap;">{{text}}</text>
+        <text class="font-size-20" style="text-overflow: clip;white-space: nowrap;">{{multiLineText}}</text>
       </view>
       <view class="margin-bottom-10">
         <text class="font-weight-bold">text-overflow:ellipsis white-space:nowrap</text>
-        <text class="font-size-20" style="text-overflow: ellipsis;white-space: nowrap;">{{text}}</text>
+        <text class="font-size-20" style="text-overflow: ellipsis;white-space: nowrap;">{{singleLineText}}</text>
+        <text class="font-size-20" style="text-overflow: ellipsis;white-space: nowrap;">{{multiLineText}}</text>
       </view>
       <view class="margin-bottom-10">
         <text class="font-weight-bold">white-space:normal</text>
-        <text class="font-size-20" style="white-space: normal;">{{text}}</text>
+        <text class="font-size-20" style="white-space: normal;">{{multiLineText}}</text>
       </view>
     </view>
   </view>
@@ -21,7 +22,8 @@
   export default {
     data() {
       return {
-        text: 'HBuilderX，轻巧、极速，极客编辑器；uni-app x，终极跨平台方案；uts，大一统语言'
+        multiLineText: 'HBuilderX，轻巧、极速，极客编辑器；uni-app x，终极跨平台方案；uts，大一统语言',
+        singleLineText: 'uts，大一统语言（单行文本）'
       }
     }
   }