栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

vue.js实现插入数值与表达式的方法分析

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

vue.js实现插入数值与表达式的方法分析

本文实例讲述了vue.js实现插入数值与表达式的方法。分享给大家供大家参考,具体如下:

vue.js在插入数值的时候有三种方式

1、插入纯文本

插入纯文本是最简单的方式,使用双大括号就能插入想要的值。

{{ msg }}

mustache也可以在属性中使用



就能显示所需要显示的文本信息了。但是有时候,我们想要插入的html文本,这时候要怎么办呢?在插入html的时候有两种方式,一种是用三个大括号的形式,这种是在vue.js 1.x 版本时候使用较多,但是在vue.js 2.x 的时候,插入纯文本的时候开始使用v-html的形式。

2、插入html

{{{ msg }}} // vue.js 1.x 版本
 // vue.js 2.x版本

被插入的内容都会被当做 HTML —— 数据绑定会被忽略。注意,你不能使用 v-html 来复合局部模板,因为 Vue 不是基于字符串的模板引擎。组件更适合担任 UI 重用与复合的基本单元。此外不建议将用户输入的值直接作为html显示,这样有可能会造成XSS攻击。对用用户输入显示的值一定要做必要的过滤之后才能真正显示。

3、属性

对于双大括号,不能在html属性中使用,对于属性,使用v-bind 来绑定数据。


 // 简写形式

附:vue.js插值与表达式示例




  
  
  
  document
  
  



  
  {{ book }}





希望本文所述对大家vue.js程序设计有所帮助。

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/80374.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号