Filters | Vue filter method
Overview[1]FiltersareremovedfromVue3.0andnolongersupported.2.xSyntax[2]In2.x,developerscouldusefiltersinordertoapplycommontextformatting.Forexample:html {{accountBalance|currencyUSD}}BankAccountBalance
Filters are removed from Vue 3.0 and no longer supported.
2.x Syntax [2]In 2.x, developers could use filters in order to apply common text formatting.
For example:
html<template> <h1>Bank Account Balance</h1> <p>{{ accountBalance | currencyUSD }}</p> </template> <script> export default { props: { accountBalance: { type: Number, required: true } }, filters: { currencyUSD(value) { return $ + value } } } </script>While this seems like a convenience, it requires a custom syntax that breaks the assumption of expressions inside curly braces being "just JavaScript," which has both learning and implementation costs.
3.x Update [3]In 3.x, filters are removed and no longer supported. Instead, we recommend replacing them with method calls or computed properties.
Using the example above, here is one example of how it could be imple...