您当前的位置: 首页 > 学无止境 > JS经典实例 网站首页JS经典实例
全局过滤器
发布时间:2020-02-16 20:55:43编辑:雪饮阅读()
全局过滤器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style></style>
</head>
<body>
<div id="app"></div>
<script type="text/javascript" src="./node_modules/vue/dist/vue.js"></script>
<script type="text/javascript">
//定义全局过滤器
Vue.filter('myReverse',function(value){
return value.split('').reverse().join();
});
var App = {
//调用过滤器myReverse通过管道将值传递给myReverse
template: `
<div>
<input type="number" />
<p>{{"测试220807" | myReverse}}</p>
</div>
`,
data() {return {}}
};
new Vue({
el: '#app',
template: `<App></App>`,
data() {
return {}
},
components: {App}
});
</script>
</body>
</html>
向过滤器传递参数
Vue.filter('myReverse',function(value,arg1){
return value.split('').reverse().join()+"接收到的参数"+arg1;
});
<p>{{"测试220807" | myReverse('bia')}}</p>
关键字词:vue,全局过滤器
下一篇:侦听器