Vue全局API详解

Vue.extend(option)

  • 参数: { Object } options
  • 用法: 用基础 Vue 构造器, 创建子类, 参数是一个包含组件选项的对象, data选项是特例, 需要注意- 在 Vue.extend() 中它必须是函数
  • 示例:
<div id="mount-point"></div>

// 创建构造器
var profile =  Vue.extend({ 
template: '<p>{{firstName}} {{lastName}} aka {{alias}}</p>',
data: function(){
	return { 
		firstName: 'Walter',
     		lastName: 'White',
       		alias: 'Heisenberg'
	 }
      }
 })

// 创建Profile实例, 并挂载到一个元素上
new Profile().$mount('#mount-point')

// 结果如下
<p>Walter White aka Heisenberg</p>

Vue.nextTick(callback, context)

  • 参数:{Function} [callback] {Object} [context]
  • 用法:在下次DOM更新循环结束之后执行延迟回调, 在修改数据之后立即使用到这个方法, 获取更新后的DOM
  • 示例:
// 修改数据
vm.msg = 'Hello'

// DOM还没更新
Vue.nextTick(function () {
	// DOM更新了
})

// 作为一个 Promise 使用 (2.1.0 起新增,详见接下来的提示)
Vue.nextTick()
  .then(function () {
    // DOM 更新了
  })
  • 2.1.0 起新增: 如果没有提供回调且在支持 Promise 的环境中,则返回一个 Promise。请注意 Vue 不自带 Promise 的 polyfill,所以如果你的目标浏览器不原生支持 Promise (IE:你们都看我干嘛),你得自己提供 polyfill。

vue.set(target, propertyName/index, value)