美文网首页
Vue -- 双向过滤器去除html标签

Vue -- 双向过滤器去除html标签

作者: 小盐_814e | 来源:发表于2019-11-13 11:32 被阅读0次

转载
https://www.cnblogs.com/xinchenhui/p/8607522.html

<div id="box">
    <input type="text" v-model="msg | filterHtml">
    <br>
    <label v-html="msg"></label>
</div

js:

new Vue({
    el:'#box',
    data:{
        msg:'<strong>这是段文字!</strong>'//定义一段文字
   }
});

Vue.filter('filterHtml',{
    read:function(val){//val就是以获取的msg的值
        return val.replace(/<[^>]*>/g);//去除文字的<...></...>标签
    },
    write:function(){
        return val;
    }
});

相关文章

网友评论

      本文标题:Vue -- 双向过滤器去除html标签

      本文链接:https://www.haomeiwen.com/subject/jxjhictx.html