vue模板引擎_vue 模板语法

99de2d4821fad046d48f55560364a7ef.png

Vue.js 允许开发者声明式地将DOM绑定至底层Vue实例的数据

在底层的实现上,Vue将模板编译成虚拟DOM渲染函数。结合响应系统,Vue能够只能地计算出最少需要重新玄滩多少组件,并把DOM操作次数减到最少

也可不用模板,直接写渲染(render)函数,使用可选的JSX语法

插值

**文本**

数据绑定: {{ }} > ` Message: {{ msg }} ` >

> // 无论何时,绑定的数据对象上的属性发生了改变,插值处的内容都会更新

  • v-once 指令,执行一次性的插值,当数据发生改变时,插值处的内筒不会更新。

原始HTML

  • v-html 指令,输出真正的HTML 例子:

Using mustaches: {{ rawHtml }}

Using v-html directive:

复制代码

输出显示:

d6e564b5cb7ec3391e9d4bbb1ae70218.png

注意,不能使用 v-html 来符合局部模板,因为Vue不是基于字符串的模板引擎。

反之,对于用户界面(UI),组件更实用作为可重用和可组合的基本单位

你的站点上动态渲染的任意HTML可能会非常危险,因为它很容易导致 XXS攻击 。只对可信内容使用HTML插值,绝对不要对用户提供的内容使用插值

特性

模板表达式都被凡在沙盒中,只能访问全局变量的一个白名单,如 Math 和 Date . 不应该在模板表达式中试图访问用户定义的全局变量

指令

指令(Directives)是带有` v-`前缀的特殊特性。指令特性的值预期是**单个JavaScript表达式**

` v-for`是例外情况

参数

一些指令能够接收一个“参数

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值