> vue 2 查缺补漏

>>>> 动态 属性绑定

<a :[href]="url">点击跳转</>

>>>> 循环绑定

<ol v-for(value,index)>
  <li>dd</li>
</ol>
<url>
  <li v-for(value,key,index)></li>
</ul>

>>>> 方法传值 传入事件对象

<button @click="eventFn($event)"></button>

//阻止 默认行为
function eventFn(e){
  e.preventDefault();
  //阻止 冒泡
  e.stopPropagation();
}

>>>> 多事件触发

<button @click="a(1),b(2)"></button>

>>>> 事件修饰符

<!-- 阻止单击事件继续传播 -->
<a @click.stop="doThis"></a>

<!-- 提交事件不再重载页面 -->
<form @submit.prevent="onSubmit"></form>

<!-- 修饰符可以串联 -->
<a @click.stop.prevent="doThat"></a>

<!-- 只有修饰符 -->
<form @submit.prevent></form>

<!-- 添加事件监听器时使用事件捕获模式 -->
<!-- 即内部元素触发的事件先在此处理，然后才交由内部元素进行处理 -->
<div @click.capture="doThis">...</div>

<!-- 只当在 event.target 是当前元素自身时触发处理函数 -->
<!-- 即事件不是从内部元素触发的 -->
<div @click.self="doThat">...</div>

>>>> 按键修饰符 弃用

https://cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6

>>>> vuex 变化监听

computed:{
      getProduct(){
          // this.$tore.state.xxx
          return this.$store.state.product;
      }
  }

>>>> sass 的支持

安装 sass-loader、node-sass
修改为
<style lang="sass" scope></style>

>>>> 父组件 修改子组件 数据、调用子组件函数

给子组件 加 ref="home"
this.$refs.home.(方法或者变量)

>>>> 子组件 修改父组件 数据、调用父组件函数

this.$parent.(方法或者变量)

>>>> 自定义组件事件 (实现子组件向父组件传值)

//父组件
<header @send="some()"></header>

//子组件
this.$emit("some");

this.$emit("方法名","数据");
"数据" 可以为简单类型 也可以是对象

如果需要验证子组件传的值
可以在 emits 中进行

emits:{
//some 就是自定义事件名称
some:({username,pwd})=>{
    //判断逻辑
  }
}

>>>> 非父子组件传值

需要使用第三方框架 mitt 我感觉基本不会用到
vuex算了 或者 vue-router传值

>>>> v-mode 实现自定义组件的 双向数据绑定

<input
        type="text"
        :value="userName"
        placeholder="账号"
        @input="$emit('update:userName', $event.target.value)"
/>

>>>> slots的使用

<template>
  <button>
    <slot></slot>
  </button>
</template>

>>>> 改变默认继承