vue.js入门教程之基础语法小结
发布时间：2020-12-17 03:05:22 所属栏目：百科 来源：网络整理
导读：前言 Vue.js是一个数据驱动的web界面库。Vue.js只聚焦于视图层，可以很容易的和其他库整合。代码压缩后只有24kb。 以下代码是Vue.js最简单的例子， 当 input 中的内容变化时，p 节点的内容会跟着变化。 {{message}} new Vue({ el: '#demo',data: { message:
前言Vue.js是一个数据驱动的web界面库。Vue.js只聚焦于视图层，可以很容易的和其他库整合。代码压缩后只有24kb。 以下代码是Vue.js最简单的例子， 当 input 中的内容变化时，p 节点的内容会跟着变化。 {{message}}
new Vue({
el: '#demo',data: {
message: 'Hello Vue.js!'
}
})
vue.js的基础语法插入文本Message: {{ text }}
插入html格式的文本，在页面显示为html的格式Message: {{{ html }}}
内容不跟随data的变化Message: {{ * text }}
属性上绑定数据在{{}}中使用js表达式在{{}}中使用js语句if指令
这里 v-if指令将根据表达式 greeting值的真假删除/插入
元素。 href指令click指令回车指令缩略写法v-bind v-on 总结模板中表达式非常便利，但是它们实际上只用于简单的操作。模板是为了描述视图的结构。在模板中放入太多的逻辑会让模板过重且难以维护。这就是为什么 Vue.js 将绑定表达式限制为一个表达式。如果需要多于一个表达式的逻辑，应当使用计算属性。小编会在后面给更新如何使用计算属性。感兴趣的朋友们请继续关注编程之家。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |