vue 页面上有多个vue实例
2个回答
推荐于2017-04-17
展开全部
1、响应式属性和方法
每个 Vue 实例都会代理其 data 对象里所有的属性。
var data = { a: 1 }
var vm = new Vue({
data: data
})
vm.a === data.a // -> true
// 设置属性也会影响到原始数据
vm.a = 2
data.a // -> 2
// ... 反之亦然
data.a = 3
vm.a // -> 312345678910111213
即:都可以使vm.xxx这种方式获取和修改实例属性。
注意:
注意只有这些被代理的属性是响应的。如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。我们将在后面详细讨论响应系统。
那么这种情况的话,可以使用VueJs的vm.$xxx的方式来修改实例属性,这同样会触发视图更新,响应式的改变。
2、生命周期钩子
生命周期钩子包括created、beforeCompile、compiled、ready、beforeDestroy、destroyed
钩子的 this 指向调用它的 Vue 实例
我们可以在钩子的方法中使用this来指代当前实例。Vuejs中没有控制器的概念,组件的自定义逻辑可以分割在这些钩子里面。
3、插值
每个 Vue 实例都会代理其 data 对象里所有的属性。
var data = { a: 1 }
var vm = new Vue({
data: data
})
vm.a === data.a // -> true
// 设置属性也会影响到原始数据
vm.a = 2
data.a // -> 2
// ... 反之亦然
data.a = 3
vm.a // -> 312345678910111213
即:都可以使vm.xxx这种方式获取和修改实例属性。
注意:
注意只有这些被代理的属性是响应的。如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。我们将在后面详细讨论响应系统。
那么这种情况的话,可以使用VueJs的vm.$xxx的方式来修改实例属性,这同样会触发视图更新,响应式的改变。
2、生命周期钩子
生命周期钩子包括created、beforeCompile、compiled、ready、beforeDestroy、destroyed
钩子的 this 指向调用它的 Vue 实例
我们可以在钩子的方法中使用this来指代当前实例。Vuejs中没有控制器的概念,组件的自定义逻辑可以分割在这些钩子里面。
3、插值
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询