vue节点关联
Vue是一款现代化的JavaScript框架，提供了直接操作DOM的API、组件化开发等功能。在Vue中，节点之间的关联是非常重要的概念，因为它决定了Vue如何通过数据驱动响应式地渲染视图。
节点关联可以分为以下两种：
// 父子关联
Vue.component('child-component', {
template: '<div>{{msg}}</div>',
props: ['msg']
})
new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
<div id="app">
<child-component :msg="message"></child-component>
</div>
// 兄弟关联
new Vue({
el: '#app1',
data: {
message: 'Hello Vue!'
}
})
new Vue({
el: '#app2',
data: {
message: 'Hello World!'
}
})
<div id="app1">
{{message}} // Hello Vue!
</div>
<div id="app2">
{{message}} // Hello World!
</div>在上面的例子中，子组件通过props属性与父组件建立了父子关联，子组件可以通过props属性获取父组件传递过来的数据，这种关联方式使得组件间的数据传递变得非常灵活。
而兄弟关联则是指不同组件之间的关联，例如上述例子中的两个Vue实例，它们不在同一个组件内，而是直接通过两个不同的DOM节点渲染，在这种情况下，要想实现兄弟关联，需要使用Vue实现数据共享。
节点关联是Vue中非常重要的概念，恰当利用它可以帮助我们更好地开发组件化的应用程序，提高开发效率和代码质量。