vue学习补充

• v-on绑定事件，后面跟事件类型
  v-on:evevtType.事件修饰符=‘事件处理函数’
  事件类型：dom类型：click、submit、hover……
  自定义类型：dd、（组件通信）
  v-on：click=“ ”可缩写为@click=“ ”
• v-bind绑定属性，动态绑定属性
  v-bind:属性名=‘属性值’
  可缩写为 :src=" "
• v-if和v-for都是循环，v-for需要在数据内容使用{{***}}模板循环输出数据
• 列表渲染和条件渲染都要加key，意为唯一值
  条件渲染一般会用到v-if和v-show，使用v-if时要搭配使用key，v-show不需要；
  if是满足条件的才会被渲染，show则会渲染所有的元素，通过display来控制是否显示；
  当需要进行频繁的显示隐藏切换时需要用到v-show，可以节省dom开销，不需要拿掉现在的换一个新的dom；
  不频繁的话用if，渲染出来以后，只要不切换，dom节点可以不变
• v-show=“ ** ”，双引号内语句为真时，则会显示
• v-model 双向数据绑定，通常用在表单元素中
  <input v-model “ msg ”>
  作用：1.将msg的值作为input的默认值；2.用户如果操作了表单，v-model会将表单元素中的值映射到msg中
• v-bind:model=：【通常应用在form元素中】
• v-html 将html输出并解析
• vue先创建实例，把模板转换为虚拟dom，虚拟dom再渲染到页面，大体是这样

关于ref： 被用来给元素或子组件注册引用信息，引用信息将会注册在父组件的 $ refs上，如果在普通的DOM元素上使用，那么就是指向普通的DOM元素。在Vue中，不用获取dom节点，元素绑定ref之后，直接通过this.$ refs即可调用，这样可以减少获取dom节点的消耗。通俗的讲，ref特性就是为元素或子组件赋予一个ID引用,通过this.$ refs.refName来访问元素或子组件的实例
三种使用情况：
1、加在普通元素上获取到的是dom元素
2、加在组件上获取到的是组件实例
3、在v-for中使用，可获取一组数组或者dom节点
关于this.$refs： 是一个对象，持有当前组件中注册过 ref特性的所有 DOM 元素和子组件实例。 注意： $refs只有在组件渲染完成后才填充，在初始渲染的时候不能访问它们，并且它是非响应式的，因此不能用它在模板中做数据绑定