vuejs语法

上篇文章 介绍了如何通过vue.js实现响应用户的操作,这篇文章我们将学习vue.js的基础语法。

  • 插入文本
  Message: {{ text }}
  • 插入html格式的文本,在页面显示为html的格式
  Message: {{{ html }}}
  • 内容不跟随data的变化
 Message: {{ * text }}
  • 属性上绑定数据
  • 在{{}}中使用js表达式
{{ number + 1 }}
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }}
  • 在{{}}中使用js语句
{{ var a = 1 }}
{{ if (ok) { return message } }}
  • if指令

Hello!

这里 v-if指令将根据表达式 greeting值的真假删除/插入

元素。

  • href指令

或者

  • click指令

  • 回车指令

  • 缩略写法
    • v-bind







  • v-on




模板中表达式非常便利,但是它们实际上只用于简单的操作。模板是为了描述视图的结构。在模板中放入太多的逻辑会让模板过重且难以维护。这就是为什么 Vue.js 将绑定表达式限制为一个表达式。如果需要多于一个表达式的逻辑,应当使用计算属性。下一篇将学习如何使用计算属性。

你可能感兴趣的:(vuejs语法)