vue指令v-html中使用過濾器filters功能

Vue 2.0 再也不支持在 v-html 中使用過濾器

解決方法：

1：全局方法（推薦）

2：computed 屬性

3：$options.filters（推薦）

1：使用全局方法：

能夠在 Vue 上定義全局方法：

Vue.prototype.msg = function（msg）{

　　return msg.replace（"\n"，"<br>"）

}；

而後全部地方上均可以直接用這個方法了：

<div v-html="msg(content)"></div>

2：computed 屬性

var appMain = new Vue({

　　data:{

　　　　content："XXX"

　　}，

　　el："#appMain"，

　　computed：{

　　　　content：function(msg){

　　　　　　return msg.replace("\n"，"<br>")

　　　　}

　　}

})

頁面上：

<div>{{content}}</div>

3：$options.filters：

在定義的vue裏的filter添加方法：

var appMain = new Vue({

　　el："#appMain"，

　　filters：{

　　　　msg：function(msg){

　　　　　　return msg.replace(/\n/g，"<br>")

　　　　}

　　}，

　　data：{

　　　　content："XXXX"

　　}

})

而後頁面上均可以直接用這個方法了：

<div id="appMain">

　　<div v-html="$options.filters.msg(content)"></div>

</div>

實例場景分析以及應用：當後臺返回的數據包含一些特殊字符須要處理時，代碼以下：