几个比较常用的Vue.js的全局API
几个比较常用的Vue.js的全局API
- Vue.extend( options )
- Vue.nextTick( [callback, context] )
- Vue.set( target, propertyName/index, value )
- Vue.delete( target, propertyName/index )
- Vue.directive( id, [definition] )
- Vue.use( plugin )
- Vue.observable( object )
- Vue.version
Vue.extend( options )
参数：
{Object} options
用法：
使用基础 Vue 构造器，创建一个“子类”。参数是一个包含组件选项的对象。
data 选项是特例，需要注意 - 在 Vue.extend() 中它必须是函数
//这里的代码是我初用路由的代码
const Home=Vue.extend({
template:'这是Home内容
'
});
const About=Vue.extend({
template:'这是About内容
'
});
Vue.nextTick( [callback, context] )
参数：
{Function} [callback]
{Object} [context]
用法：
在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。
代码示例：
//html
{{msg}}
//js
结果：
Vue.set( target, propertyName/index, value )
参数：
{Object | Array} target
{string | number} propertyName/index
{any} value
返回值：设置的值。
用法：
向响应式对象中添加一个属性，并确保这个新属性同样是响应式的，且触发视图更新。它必须用于向响应式对象上添加新属性，因为 Vue 无法探测普通的新增属性 (比如 this.myObject.newProperty = ‘hi’)
注意:对象不能是 Vue 实例，或者 Vue 实例的根数据对象。
添加一个新属性，address,其值为长沙
Vue.delete( target, propertyName/index )
参数：
{Object | Array} target
{string | number} propertyName/index
仅在 2.2.0+ 版本中支持 Array + index 用法。
用法：
删除对象的属性。如果对象是响应式的，确保删除能触发更新视图。这个方法主要用于避开 Vue 不能检测到属性被删除的限制，但是你应该很少会使用它。
目标对象不能是一个 Vue 实例或 Vue 实例的根数据对象。
删除sex属性
新增一个属性及删除某属性的代码如下
//html
对象：{{obj}}
//js
Vue.directive( id, [definition] )
参数：
{string} id
{Function | Object} [definition]
用法：
注册或获取全局指令。
示例：
自定义聚焦指令
//html
//js
第一个未使用自定义聚焦事件，第二个使用了自定义聚焦事件
效果：
Vue.use( plugin )
参数：
{Object | Function} plugin
用法：
安装 Vue.js 插件。如果插件是一个对象，必须提供 install 方法。如果插件是一个函数，它会被作为 install 方法。install 方法调用时，会将 Vue 作为参数传入。
该方法需要在调用 new Vue() 之前被调用。
当 install 方法被同一个插件多次调用，插件将只会被安装一次。
例如我们要使用Element ui的里的某些样式时,
就要用到这个了
Vue.use(ElementUI)
//使用前提是你已经装好了Element ui
Vue.observable( object )
参数：
{Object} object
用法：
让一个对象可响应。Vue 内部会用它来处理 data 函数返回的对象。
返回的对象可以直接用于渲染函数和计算属性内，并且会在发生改变时触发相应的更新。也可以作为最小化的跨组件状态存储器，用于简单的场景
Vue.version
细节：提供字符串形式的 Vue 安装版本号。这对社区的插件和组件来说非常有用，你可以根据不同的版本号采取不同的策略。