過濾器只能用在插值表達式和v-bind 格式{{name | 過濾器名稱}}
過濾器的定義語法
Vue.filter('過濾器的名稱',function(){})
過濾器中的function,第一個參數已經被規定死了,永遠都是過濾器管道符’|’,前面傳遞過來的數據
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="../lib/vue.js"></script>
<link rel="stylesheet" href="../lib/bootstrap3.3.7.css">
</head>
<body>
<dip id="app">
<!-- msg這個值交給後面這個過濾器處理 -->
<p>{{msg|msgFormat('實習','加油')|test}}</p>
</dip>
<script>
// 字符串的replace方法 第一個參數可以寫字符串或者正則
// 定義一個Vue全局的過濾器，名字叫做msgFormat 裏面可以傳一個或者多個參數，但是在過濾器的function裏添加參數
//可以同時使用多個過濾器
Vue.filter('msgFormat', function (msg, arg, arg2) {
return msg.replace(/工作/g, arg + arg2)
})
//第二個過濾器
Vue.filter('test', function (msg) {
return msg + "!!!!!"
})
var vm = new Vue({
el: "#app",
data: {
msg: "我想很快找到工作，這樣就不用去學校了，工作使我快樂，我熱愛工作"
},
methods: {}
})
</script>
</body>
</html>