vue 页面上有多个vue实例

发布网友发布时间：2022-05-01 17:45

共2个回答

热心网友时间：2022-04-20 03:35

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、插值

热心网友时间：2022-04-20 04:53

router-view:页面显示路由组件内容，默认显示defalut组件内容，如果要显示多个组件内容需要使用带有name属性，来显示具名路由;带有name属性的router-view需放在父级路由页面。