uniapp删除线

在UniApp中添加删除线的方法

使用CSS样式实现删除线

通过CSS的text-decoration属性可以轻松实现删除线效果。在UniApp的页面或组件中，直接为文本元素添加样式类即可：

.text-with-strikethrough {
  text-decoration: line-through;
}

在模板中使用

将样式应用到需要删除线的文本上：

<view class="text-with-strikethrough">这段文字将有删除线</view>

动态控制删除线

通过绑定class或style实现动态控制：

<view :class="{ 'text-with-strikethrough': isDeleted }">可动态控制的文本</view>
<view :style="{ textDecoration: isDeleted ? 'line-through' : 'none' }">另一种方式</view>

使用条件渲染

如果需要完全隐藏被删除的内容，可以结合条件渲染：

<view v-if="!isDeleted">正常显示</view>
<view v-else class="text-with-strikethrough">已删除状态</view>

注意事项

1. 该样式在所有平台（H5、小程序、App）均有效
2. 删除线颜色默认与文本颜色相同
3. 可通过text-decoration-color单独设置删除线颜色（部分平台可能不支持）