v-model 不能使用过滤器，因其是双向绑定语法糖，而过滤器仅作用于读取阶段；编辑态应绑定原始字段，展示态才用过滤器，输入格式化需通过 @input 或计算属性实现。
不能在 v-model 上使用过滤器，这是 Vue 2 和 uni-app 的明确限制，不是写法问题，而是设计机制不支持。
为什么 v-model 和过滤器不能混用
因为 v-model 是双向绑定语法糖，本质是 :value + @input 的组合。过滤器只作用于「读取」（如 {{ value | filter }}），无法参与「写入」流程——你无法让 @input 自动把“李**明”还原成“李小明”，这会破坏数据源单一性，也违背响应式原则。
- 常见错误：在输入框里写
<input v-model="userInfo.name" /> {{ userInfo.name | hideName }}，结果用户输入“张三丰”时，视图立刻显示“张*丰”，但userInfo.name仍是原始值，造成视觉与数据错位 - 更危险的做法：在
@input里手动调用过滤函数并赋值给userInfo.name，这会让原始数据被污染，后续表单提交、校验、编辑回填全部出错 - uni-app 小程序端对字符串截取和 Unicode 处理敏感，若过滤器内部用
.substr()或.length，还可能在旧安卓 WebView 中误判中文字符数，进一步放大混乱
正确区分编辑态和展示态
所有脱敏、格式化、大小写转换类逻辑，必须严格按使用场景拆开：
- 编辑态（
<input v-model="userInfo.name">）：直接绑定原始字段，不做任何过滤 - 展示态（资料页、列表项、弹窗摘要）：用
{{ userInfo.name | hideName }}或{{ userInfo.name | toLower }} - 如果需要“输入时实时预览脱敏效果”，单独加一个只读展示区：
<div>{{ userInfo.name | hideName }}</div>，和v-model完全解耦
替代方案：需要格式化输入时怎么办
当业务真要求输入即转小写、自动补零、或限制长度时，不能靠过滤器，得用更可控的方式：
- 用
@input+ref手动控制：监听输入事件，调用toLowerCase()或正则清洗后，再赋值给 data 字段（注意要同步更新视图，避免光标跳动） - 用计算属性 +
watch：定义formattedName计算属性返回处理后的值，再用watch监听原始字段变化，反向更新副本，确保单向数据流 - 对日期、数字等强格式字段，优先在提交前做校验和标准化，而不是塞进
v-model流程里
最容易被忽略的是：很多人试图用过滤器“偷懒”解决输入格式问题，结果在小程序真机上遇到光标错位、输入延迟、甚至安卓低端机白屏。真正稳定的方案永远是把格式逻辑收口到数据层或事件处理中，而不是依赖模板语法的单向渲染能力。
