学习记录：Vue常用Api

一，全局Api

// 获取更新后的 DOM
1, Vue.nextTick( ()=>{} )
// 设置对象属性的新增，确保该属性是响应式的。
2，Vue.set(target, propertyName/index, value)
// 删除对象属性，确保删除能更新视图。
3，Vue.delete( target, propertyName/index )
// 注册或获取全局指令
4，Vue.directive('my-directive', {
      bind: function () {},
      inserted: function () {},
      update: function () {},
      componentUpdated: function () {},
      unbind: function () {}
   })
    // 注册 (指令函数)
    Vue.directive('my-directive', function () {
      // 这里将会被 `bind` 和 `update` 调用
    })
    // getter，返回已注册的指令
    var myDirective = Vue.directive('my-directive')
// 注册或获取全局组件
5，Vue.component('my-component', { /* ... */ })
// 安装 Vue.js 插件
6，Vue.use( plugin )：参数为对象或者函数
// 全局混入
7，Vue.mixin( mixin )：参数为object

二，选项/组合provide / inject

provide：Object | () => Object
inject：Array<string> | { [key: string]: string | Symbol | Object }

三，选项/其他 model

// 1，允许一个自定义组件在使用 v-model 时定制 prop 和 event。
// 2，默认情况下，一个组件上的 v-model 会把 value 用作 prop，input 用作 event
// 3，一些输入类型比如单选框和复选框按钮value有其他作用，故：
Vue.component('my-checkbox', {
  model: {
    prop: 'checked',
    event: 'change'
  },
  props: {
    // this allows using the `value` prop for a different purpose
    value: String,
    // use `checked` as the prop which take the place of `value`
    checked: {
      type: Number,
      default: 0
    }
  },
  // ...
})

<my-checkbox v-model="foo" value="some value"></my-checkbox>

// 上述代码相当于：
<my-checkbox
  :checked="foo"
  @change="val => { foo = val }"
  value="some value">
</my-checkbox>

四，实例属性 ref, $attrs, $listeners，$props

// 一个对象，可以获取到该ref组件上的所有属性和方法
1，vm.$refs

// 组件标签上绑定的非props的特性(class和style除外)向下传递 

2，vm.$attrs 
  可以通过 v-bind="$attrs" 传入内部组件，

// 包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器
3，vm.$listeners
   可以通过 v-on="$listeners" 传入内部组件

// 当前组件接收到的 props 对象。
4, vm.$props
    可以通过v-bind="$props"父组件的所有props下发给它的子组件，
    子组件需要在其props:{} 中定义要接受的props

// 

五，实例方法  $on, $emit, $watch, $set, $nextTick, $forceUpdate()