Vue的学习笔记

1.Vue.js为主流的前端框架，出现的问题：

• 在这之前需要手写js代码，浏览器兼容问题较大，后来jquery解决了这个问题，但是需要渲染页面很麻烦，如渲染表格追加dom中的标签。
• dom操作较多，提高渲染效率，双向数据绑定，只需要关心数据的业务逻辑。
• 不必关心dom如何渲染。

2.Vue使用步骤

• 1.导入vue的包，创建实例

<script>
  var vm = new Vue({
    el:  ‘#appId’, //控值页面的那个区域
    data:{  //el 中用到的数据
      msg: 'hello vue' //通过vue指令渲染数据到页面，不需要手动操作dom元素  <p>{{ msg }}</p>可以取出值
    }
  })
</script>

3.Vue常用指令

• v-text="msg" 和表达式{{}}是一样的,默认没有闪烁问题，会覆盖标签体的内容，表达式不会。
• v-html="msg"会渲染标签体
• v-bind用于绑定属性
• v-on:mouseover 鼠标覆盖事件
• v-on 用来绑定事件如：v-on:click="show"

methods:{ //定义了当前Vue所有的可用方法
  show:function(){
    alert('hello')
  }
}

• v-model 双向数据绑定