谁是孩子，谁是vue.js的父级
我是Vue.js的新手。我对Vue组件之间的通信做了一些简单的练习。但我仍然有一个问题，谁是孩子，谁是家长。例如，我有以下代码：
HTML:
<body>
<div id="root" class="component">
<coupon @applied="onCouponApplied"></coupon>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.5/css/bulma.css"
/>
<!-- <script src="app.js"></script> -->
<script src="main.js"></script>
</body>VUE.JS:
Vue.component("coupon", {
template: `
<div>
<input palceholder="Put your name" @blur="onCouponApplied"/>
</div>
`,
data() {
return {
message: ""
};
},
methods: {
onCouponApplied() {
this.$emit("applied");
}
}
});
new Vue({
el: "#root",
methods: {
onCouponApplied() {
alert("that's work!");
}
}
});所以..。这里有组件coupon和new Vue。我猜new Vue是个家长。但是..。我试着去理解它是如何工作的。有人能简单地向我解释一下它的工作原理吗？我阅读了vue.js文档，但仍然有一个问题:/
回答 3
Stack Overflow用户
发布于 2019-08-14 12:55:22
所有组件都引用您提到的Vue实例。因此，您的优惠券组件是您的根div的子组件。父组件是嵌入另一个组件的组件。
"UserListView“将包含一个包含用户组件的列表组件。视图是列表的父视图，列表可以是用户组件的父视图。
Stack Overflow用户
发布于 2019-08-14 12:58:39
您的整个应用程序由组件组成。每个 Vue应用程序至少有一个组件是父组件(Vue实例)。
您制作的其他每个组件都成为Vue实例的直接或间接子组件。
来自官方文件
Vue应用程序由用新Vue创建的根Vue实例组成，可以选择组织成嵌套的可重用组件树。
Stack Overflow用户
发布于 2019-08-14 13:13:22
根div是父级。您正在创建一个新的Vue实例 ( new Vue({ )，并将其与带有'root‘id ( el: "#root", )标记的div元素关联。优惠券组件包含在此div元素中，使其成为子元素。
https://stackoverflow.com/questions/57495077
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号