我正在尝试执行 ref
的标准实现,以便可以将子元素插入到我的 InfoBox
中。但无论我似乎将其作为“ref”元素,都永远不会进入我的 InfoBox 组件。日志调用的结果始终是{} undefined
。
点击处理程序用于测试计时问题,因为使用 created
与 mounted
似乎是一个常见问题。
<InfoBox
v-if="waitingForCode">
<p ref="infoboxcontent">A 7-digit verification code has been sent.</p>
</InfoBox>
和
<template>
<div
class="info-box"
@click="clicked" >
{{ this.$refs.infoboxcontent }}
</div>
</template>
<script>
export default {
name: 'InfoBox',
mounted() {
console.log(this.$refs, this.$refs.infoboxcontent)
},
methods: {
clicked() {
console.log(this.$refs, this.$refs.infoboxcontent)
}
}
}
</script>
<style scoped>
// some style
</style>
我开始认为我从根本上误解了“ref”属性的用法,因为这似乎是一个微不足道的例子。任何帮助将不胜感激。
最佳答案
关于javascript - 'this.$refs' 在父组件中始终为空,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50873677/