vue 3 已移除过滤器 api，uni-app 3.x 全端不支持 vue.filter() 和模板管道符 |，需改用 methods/computed 或 utils 纯函数显式调用，并注意类型防护与性能优化。
不能用 Vue.filter()，也不能在模板里写 {{ value | filterName }} —— Vue 3 官方已移除过滤器 API，uni-app 3.x（基于 Vue 3）完全不支持。
为什么 Vue.filter 会报错或静默失效
uni-app 3.x 使用 Vue 3 运行时，Vue.filter 方法根本不存在，调用即报 TypeError: Vue.filter is not a function。即使你强行在 main.js 中写，也会在启动阶段中断。模板中出现 | 管道符，编译器直接忽略或报错 invalid expression，不会进入 JS 执行流程。
- 检查项目是否为 Vue 3 模式：看
package.json中@dcloudio/uni-app版本是否 ≥3.0.0，或运行uni.getSystemInfoSync().platform配合构建日志确认 - H5 端也不兼容——不是“小程序不支持、H5 支持”，而是全端移除
- 别试图用
app.config.globalProperties.$filters模拟，它只提供挂载点，模板语法层面不解析|
替代方案：用 methods 或 computed 显式调用
把原本想塞进过滤器的逻辑，改写成普通函数，在模板中直接调用。这是唯一跨端稳定、可调试、可复用的方式。
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
- 简单转换（如状态码转文字）：写在
methods里，{{ statusText(item.status) }} - 带响应式依赖的格式化（如时间 + 当前语言）：用
computed，避免重复计算 - 多处复用：抽到
utils/目录下导出纯函数，例如export function statusText(code) { ... }，然后import { statusText } from '@/utils/filters' - 注意类型防护：所有入参必须做
== null或typeof x === 'string'判断，否则null?.toString()会崩
如果坚持要“类过滤器”写法，只能走 $filters 对象 + 手动调用
你可以挂一个对象到全局属性，但必须放弃管道符，改用函数调用形式。这不是语法糖，是硬编码的替代路径。
- 在
main.js中：
const app = createApp(App)
app.config.globalProperties.$filters = {
toYuan(cent) {
return Number(cent) / 100 || 0
},
formatDate(date) {
if (!date) return ''
const d = new Date(date)
return isNaN(d.getTime()) ? '' : `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`
}
}
- 模板中必须写成：
{{ $filters.formatDate(item.time) }}，不能省略$filters.前缀 - 不支持链式：
{{ $filters.toYuan($filters.formatDate(...)) }}可读性差，易出错 - 每次渲染都执行函数，无缓存；高频列表项慎用，建议提前在
onLoad或watch中处理好数据
真正容易被忽略的是：很多开发者在升级到 uni-app 3.x 后，仍沿用 Vue 2 的 filters: 选项写法，结果控制台没报错、页面也没提示，只是值原样输出——因为编译器跳过了该配置项，整个 filters 对象被丢弃。别猜，打开浏览器控制台搜 filter，如果没任何相关 log，基本就是被忽略了。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
