vue2.0版本中v-html中过滤器的使用
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>
参考:https://www.cnblogs.com/rxqlx/p/10330517.html
vue2.0版本中v-html中过滤器的使用的更多相关文章
- 注册asp.net 4.0版本到IIS服务器中
在IIS服务器的运维的过程中,有时候部署asp.net网站发现未安装.net framework对应版本信息,此时就需要重新将.net framework对应的版本注册到IIS中,此处以重新注册.ne ...
- vue的生命周期(又称钩子函数)----以及vue1.0版本与vue2.0版本生命周期的不同
vue生命周期 1. vue1.0版本与vue2.0版本生命周期的不同 vue1.0版本生命周期图示 图1 vue1.0版本生命周期 vue1.0版本的生命周期: init 实例创建之前 creat ...
- 基于vue2.0前端组件库element中 el-form表单 自定义验证填坑
eleme写的基于vue2.0的前端组件库: http://element.eleme.io 我在平时使用过程中,遇到的问题. 自定义表单验证出坑: 1: validate/resetFields 未 ...
- 国产计算框架Mindspore1.3.0 gpu源代码中的cmake文件存在问题(bug),openmpi的url错误,导致不能正常编译——成功解决mindspore-gpu-1.3.0版本不能从源代码中编译的问题
mindspore 的 r1.3 分支 在gpu方式编译下存在问题,无法编译,具体编译结果参考: https://www.cnblogs.com/devilmaycry812839668/p/1505 ...
- vue2.0版本指令v-if与v-show的区别
v-if: 判断是否加载,可以减轻服务器的压力,在需要时加载. v-show:调整css dispaly属性,可以使客户端操作更加流畅. v-if示例: <!DOCTYPE html> & ...
- vue2.x版本中Object.defineProperty对象属性监听和关联
前言 在vue2.x版本官方文档中 深入响应式原理 https://cn.vuejs.org/v2/guide/reactivity.html一文的解释当中,Object.defineProperty ...
- [转]vue项目中 指令 v-html 中使用过滤器filters功能
转载于简书 链接:http://www.jianshu.com/p/29b7eaabd1ba 问题 2.0 filters only work in mustache tags and v-bind. ...
- vue项目中 指令 v-html 中使用过滤器filters功能
转载于简书 链接:http://www.jianshu.com/p/29b7eaabd1ba 问题 2.0 filters only work in mustache tags and v-bind. ...
- vue2.0自学教程(一):走进vue2.0大观园
人狠话不多,咱直入主题吧! 开发软件: Visual Studio Code 支持环境: nodejs+windows 版本: vue2.0 1.初识vuevue是一个前端框架,使用MVVM(Mode ...
随机推荐
- nginx 反向代理之 负载均衡
Nginx通过upstream和proxy_pass实现了负载均衡.本质上也是Nginx的反向代理功能,只不过后端的server为多个. 案例一(简单的轮询): upstream www { serv ...
- shell 查找字符串中字符出现的位置
#!/bin/bash a="The cat sat on the mat" test="cat" awk -v a="$a" -v b=& ...
- SpringBoot:使用Jenkins自动部署SpringBoot项目(一)环境准备
1.安装JDK 1.在java官网下载linux下的安装包,上传到云服务器 /user/java 目录下 2.解压:tar xzvf jdk-8u161-linux-x64.tar.gz 3.为了好看 ...
- java并发编程(一)线程状态 & 线程中断 & 线程间的协作
参考文章: Java线程的5种状态及切换:http://blog.csdn.net/pange1991/article/details/53860651 线程的5种状态: 1. 新建(NEW):新创建 ...
- FZU Monthly-201906 获奖名单
FZU Monthly-201906 获奖名单 冠军: 空缺 一等奖: 陈金杰 S031702334 空缺 二等奖: 黄海东 S031702647 吴宜航 S031702645 蔡煜晖 S111801 ...
- 使用Signature Tool自动生成P/Invoke调用Windows API的C#函数声明【转】
原文链接:https://blog.csdn.net/Donjuan/article/details/3865026在网上看到很多网友在.NET程序中调用Win32 API,或者调用自己的VC DLL ...
- TP 控制器和模型里面order 写法不同
控制器: Db::table('think_user')->where('status=1')->order('id desc')->limit(5)->select(); ...
- git 学习目录
git命令方式 git - 1.基础 git - 2.github git - 3.分支 番外 git - gitHub生成Markdown目录
- golang程序编译时提示“package runtime: unrecognized import path "runtime" (import path does not begin with hostname)”
在编译golang的工程时提示错误的, 提示的错误信息如下: package bytes: unrecognized import path "bytes" (import pat ...
- 中国知网(cnki)上caj格式转pdf的方法 ----------------- 转载
原文地址: https://blog.csdn.net/edogawachia/article/details/85340636 版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议 ...