vue 指令 v-html 中使用过滤器filters功能
1问题原因:Vue2.0 不再支持在 v-html 中使用过滤器解决方法:1: 全局方法(推介)2: computed 属性3: $options.filters(推介)具体用法如下一页:21:使用全局方法可以在 Vue 上定义全局方法:Vue.prototype.msg= function (msg) { return msg.replace("\n", "
-
问题原因:
Vue2.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({
el: '#appMain',
computed :{
content: function (msg) { return msg.replace("\n", "<br>")
},
},
data: {
content: "XXXXX"
}
})
页面上:
<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: "XXXXX"
}
})
然后页面上都可以直接用这个方法了:
<div id="appMain">
<div v-html="$options.filters.msg(content)"></div>
</div>
vue在html中的使用
更多推荐
所有评论(0)