定义： 对要显示的数据进行特定格式化后再显示（适用于一些简单逻辑的处理）
过滤器可以用在两个地方：双花括号插值 或 v-bind表达式。
局部过滤器是在某一个vue实例的内容创建的，只在当前实例中起作用
<script>
export default {
data() {
return {
price: 100
};
},
filters: {
filter_addbfh(value) {
return value + '%';
}
}
};
</script>通过全局方式创建的过滤器，在任何一个vue实例中都可以使用
注意：使用全局过滤器的时候，需要先创建全局过滤器，再创建Vue实例
显示的内容,是由过滤器的返回值决定
使用语法: <h1>{{name | myfilter1}}</h1>
Vue.filter('filterName', function (value) {
// value 表示要过滤的内容
})示例（过滤器）：
<div id="root">
<h2>显示格式化后的时间</h2>
<!-- 计算属性实现 -->
<h3>现在是：{{ fmtTime }}</h3>
<!-- methods实现 -->
<h3>现在是：{{ getFmtTime() }}</h3>
<!-- 过滤器实现 -->
<h3>现在是：{{time | timeFormater}}</h3>
<!-- 过滤器实现（传参） -->
<h3>现在是：{{time | timeFormater('YYYY_MM_DD') | mySlice}}</h3>
<h3 :x="msg | mySlice">尚硅谷</h3>
</div>
<script type="text/javascript">
Vue.config.productionTip = false
//全局过滤器
Vue.filter('mySlice',function(value){
return value.slice(0,4)
})
new Vue({
el:'#root',
data:{
time:1621561377603, //时间戳
msg:'你好，尚硅谷'
},
computed: {
fmtTime(){
return dayjs(this.time).format('YYYY年MM月DD日 HH:mm:ss')
}
},
methods: {
getFmtTime(){
return dayjs(this.time).format('YYYY年MM月DD日 HH:mm:ss')
}
},
//局部过滤器
filters:{
timeFormater(value, str='YYYY年MM月DD日 HH:mm:ss'){
// console.log('@',value)
return dayjs(value).format(str)
}
}
})
</script>
用处：向其所在的节点中渲染文本内容。
与插值语法的区别：v-text会替换掉节点中的内容，{{xx}}则不会。
<div id="root">
<div>你好，{{name}}</div>
<div v-text="name"></div>
<div v-text="str"></div>
</div>
<script type="text/javascript">
Vue.config.productionTip = false
new Vue({
el:'#root',
data:{
name:'小溪',
str:'<h3>你好啊！</h3>'
}
})
</script>(使用的很少)
作用：向指定节点中渲染包含html结构的内容。
