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>

实例场景分析以及应用：当后台返回的数据包含一些特殊字符需要处理时，代码如下：