vue3 filter过滤器

vue3直接移除了filter过滤器，官方推荐，如果要使用过滤器可以使用computed计算属性和method函数来代替。

如果使用了全局过滤器，官方也提供了一个属性来进行迁移修复，但是也只推荐用于迁移。

const app = createApp(App)

//给当前app的全局属性上挂载一个过滤器对象
app.config.globalProperties.$filters = {
  currencyUSD(value) {
    return '$' + value
  }
}

使用的时候：

<template>
  <h1>Bank Account Balance</h1>
  <p>{{ $filters.currencyUSD(accountBalance) }}</p>
</template>

或者直接挂载方法：

app.config.globalProperties.currencyUSD = functionvalue) {
  return '$' + value 
}

export default {
  mounted() {
    console.log(this.currencyUSD(666))
  }
}

注意：

如果全局挂载了currencyUSD方法，组件自身也有currencyUSD方法，那么组件的方法会覆盖全局的方法，以组件内自己的方法优先。