computed 适合封装响应式文本截断逻辑：依赖变化时自动更新、结果缓存、模板中直接使用；可联动状态实现展开/收起，处理富文本需先提取纯文本；是 vue 3 替代过滤器的推荐方式。
Vue 3 的 computed 本身不直接做文本截断，但它非常适合封装和驱动截断逻辑——把“原始文本 + 截断规则”变成一个响应式、可复用、自动更新的摘要值。
用 computed 封装字符串截断逻辑
当截断长度固定、依赖明确（比如标题字段和最大字符数），用 computed 最简洁高效：
- 依赖响应式数据（如
ref或reactive中的文本）时，一旦内容或配置变化，摘要自动刷新 - 结果自带缓存：同一文本多次使用该计算属性，只计算一次，避免重复 substring
- 模板中直接写
{{ shortTitle }}，无需.value，语义清晰
示例：
（组合式 API）const title = ref("Vue 3 中如何优雅地实现长文本摘要与展开功能？")<br>const maxLength = ref(20)<br><br>const shortTitle = computed(() => {<br> return title.value.length > maxLength.value<br> ? title.value.substring(0, maxLength.value) + "..."<br> : title.value<br>})
结合状态控制动态摘要（如“展开/收起”）
若需支持用户点击切换完整/截断视图，computed 可与一个布尔状态联动，让摘要行为响应交互：
