外部JS过滤器需显式调用Vue.filter()注册且必须在new Vue()前执行，仅H5支持；小程序端|语法不解析，应改用工具函数+computed或封装兼容组件。
外部 JS 文件里的过滤器函数不能直接“引入后自动生效”，必须显式注册到 Vue.filter() 才能在模板中用 {{ value | filterName }}。但更关键的是：这种做法在小程序和 App 端根本不会执行，仅 H5 有效。
为什么 import 后调用 Vue.filter 还是不生效
常见错误是把外部 JS 文件当成了“配置即生效”的资源。实际上：
-
Vue.filter()必须在new Vue()之前调用，否则注册时机太晚，组件已渲染完成 - 外部 JS 文件若通过
import引入，但没在main.js中主动执行注册逻辑，函数只是被加载了，没挂载到 Vue 全局 - 即使注册成功，在微信/支付宝/字节等小程序平台，
|语法压根不被解析——模板里写{{ x | myFilter }}，真机上就原样输出字符串，不报错也不执行
正确引入并注册的步骤（仅限 H5 场景）
如果你确认只跑 H5，且坚持用过滤器语法，按以下顺序操作：
- 在
@/filters/index.js中导出纯函数，签名严格为(value, ...args)，不调用uni或this - 在
main.js开头import { formatDate, statusText } from '@/filters' - 紧接着逐个注册：
Vue.filter('formatDate', formatDate)、Vue.filter('statusText', statusText) - 确保所有
Vue.filter()调用都在new Vue({ ... })之前
跨端项目别碰 Vue.filter，改用工具函数 + computed
真正能稳定工作的方案，是放弃模板管道符，把过滤逻辑抽成可导入的 JS 函数：
- 在
@/utils/filters.js中写export const formatDate = (date) => { ... }，加if (!date)和isNaN(new Date(date).getTime())防护 - 页面中
import { formatDate } from '@/utils/filters'，然后在computed或methods中调用 - 需要动态格式化时，用
:placeholder="formatDate(item.time)"替代:placeholder="item.time | formatDate" - 如果非要在模板里“看起来像过滤器”，封装一个
<format-date :value="item.time"></format-date>组件，内部做平台判断和降级
最易被忽略的一点：哪怕你在 H5 上调试一切正常，只要项目要发小程序，Vue.filter 就是伪需求。把逻辑提前暴露为函数，既可测试、可缓存、可单元测试，又天然跨端——管道符只是语法糖，不是架构必需品。
