这是一个简单的问题，但我不知道使用Vue2正确执行的最佳方法：
父组件：
<template>
<div class="parent">
<child></child>
{{value}} //How to get it
</div>
</template>
子组件：
<template>
<div class="child">
<p>This {{value}} is 123</p>
</div>
</template>
<script>
export default {
data: function () {
return { value: 123 }
}
}
</script>
您可以通过以下方式实现此目的：
您可以直接通过引用访问子VM，但这会很麻烦，因为在子组件已安装且$refs不会响应之前，不会填充该引用，这意味着您必须做一些棘手的事情：
<template>
<div class="parent">
<child ref="child"></child>
<template v-if="mounted">{{ $refs.child.value }}</template>
</div>
</template>
data() {
return {
mounted: false
}
},
mounted() {
this.mounted = true;
}
$emit 子组件中的值，以便父组件在准备就绪或更改时可以获取该值。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句