vue2.0版本中v-html中过滤器的使用
Vue 2.0 不再支持在 v-html 中使用过滤器
解决方法:
1:全局方法(推荐)
2:computed 属性
3:$options.filters(推荐)
1:使用全局方法:
可以在 Vue 上定义全局方法:
1 Vue.prototype.msg = function(msg){ 2 3 return msg.replace("\n","<br>") 4 5 };
然后所有地方上都可以直接用这个方法了:
1 <div v-html="msg(content)"></div>
2:computed 属性
1 var appMain = new Vue({ 2 3 data:{ 4 5 content:"XXX" 6 7 }, 8 9 el:"#appMain", 10 11 computed:{ 12 13 content:function(msg){ 14 15 return msg.replace("\n","<br>") 16 17 } 18 19 } 20 21 })
页面上:
1 <div>{{content}}</div>
3:$options.filters:
在定义的vue里的filter添加方法:
1 var appMain = new Vue({ 2 3 el:"#appMain", 4 5 filters:{ 6 7 msg:function(msg){ 8 9 return msg.replace(/\n/g,"<br>") 10 11 } 12 13 }, 14 15 data:{ 16 17 content:"XXXX" 18 19 } 20 21 })
然后页面上都可以直接用这个方法了:
1 <div id="appMain"> 2 3 <div v-html="$options.filters.msg(content)"></div> 4 5 </div>
参考:https://www.cnblogs.com/rxqlx/p/10330517.html