几个比较常用的Vue.js的全局API

Vue.extend( options )

参数：

{Object} options
用法：

使用基础 Vue 构造器，创建一个“子类”。参数是一个包含组件选项的对象。

data 选项是特例，需要注意 - 在 Vue.extend() 中它必须是函数

//这里的代码是我初用路由的代码
const Home=Vue.extend({
			template:'<div><label>这是首页Home组件</label><p style="font-size:60px;color: #1E9FFF;">这是Home内容</p></div>'
		});
		const About=Vue.extend({
			template:'<div><label>这是首页About组件</label><p style="font-size:40px;color: gold;">这是About内容</p></div>'
		});

Vue.nextTick( [callback, context] )

参数：
{Function} [callback]
{Object} [context]

用法：
在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。

代码示例：

//html
<div id="app">
			{{msg}}
			
		</div>
//js
<script>
		let v=new Vue({
			el:'#app',
			data(){
				return{
					msg:'缥缈录1'
				}
			}
		})
	console.log(v.$el.textContent);//最初的值
	v.msg='缥缈录2';
	console.log(v.$el.textContent);//不会更新值
	v.$nextTick(function(){
		v.$el.textContent='缥缈录3'
	console.log(v.$el.textContent);//在这里成功更新了值
	})
	console.log(v.$el.textContent);//还是最初的值
	</script>

结果：

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
<div id="app">
		
			对象：<p>{{obj}}</p>
			<button @click="add()">+</button>
			<button @click="del()">-</button>
		</div>


//js
<script>
		new Vue({
			el:'#app',
			data(){
				return{
					obj:{
						name:'water',
						age:17,
						sex:'女'
					}
				}
			},
			methods:{
				
				add(){
					let sx=prompt('要加入的属性');
					let v=prompt('要加入的属性值');
					this.$set(this.obj,sx,v);
				},
				del(){
					let sx=prompt('要删除的属性');
					this.$delete(this.obj,sx);
				}
				
			}
			
		})
		
	</script>

Vue.directive( id, [definition] )

参数：

{string} id
{Function | Object} [definition]
用法：

注册或获取全局指令。

示例：
自定义聚焦指令

//html
<div id="app">
			<input type="text" />
			<input type="text" v-focus />
		</div>


//js
<script>
		// 注册一个全局自定义指令 v-focus
		Vue.directive('focus', {
			// 当绑定元素插入到 DOM 中。
			inserted: function(el, binding) {
				// 聚焦元素
				el.focus();
			}
		});

		new Vue({
			el: '#app'
		});
	</script>

第一个未使用自定义聚焦事件，第二个使用了自定义聚焦事件

效果：

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 安装版本号。这对社区的插件和组件来说非常有用，你可以根据不同的版本号采取不同的策略。