Vue基本使用与常用语法

69 阅读1分钟

Vue基本使用

+ 下载引入
+ 准备根节点
+ 初始化Vue实例
+ 渲染数据

Vue常用语法

  1. HTML区域语法
  • {{}} 普通数据渲染
  • v-html 渲染富文本
  • v-if v-elseif v-else v-show 条件渲染(控制元素显示隐藏)
  • v-for="(item,index) in 数据包" 列表渲染(可以遍历数组、对象)
遍历对象
<div v-for="(value, name) in object">
 {{ name }}: {{ value }}
</div>
  • v-bind:class 属性动态控制 简写 :class
  • v-on:click 事件绑定 简写 @click
  • v-model 表单操作的双向绑定
  1. JS区域语法
new Vue({
  el:'#app',  //占地盘
  data:{     //数据(经济)
    按需自定义各种数据键值对
  },
  computed:{  //数据(处理data后得到的数据)

  },
  methods:{  //存放事件函数

  },
  
})