我想為div包含的Component2另一個 div (modelDiv)提供相同的高度Component1。
<template>
<div>
<div v-if="showMe">
<div ref="modelDiv">
<Component1/>
</div>
</div>
<div v-else>
<div :style="setDivHeight">
<Component2/>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
displayMe: true,
elementHeight: null,
}
},
computed: {
showMe() {
return this.displayMe
},
setDivHeight() {
return `height: ${this.elementHeight}px;`
},
},
mounted() {
this.$nextTick(function () {
this.elementHeight = this.$refs.modelDiv[0].$el.clientHeight
})
},
}
</script>
我收到此錯誤訊息TypeError: Cannot read properties of undefined (reading '$el')并console.log('the height', this.$refs)給我modelDiv: undefined. 我不明白為什么。歡迎任何幫助。
uj5u.com熱心網友回復：
那應該作業：
this.elementHeight = this.$refs.modelDiv.clientHeight;
演示：https : //codesandbox.io/s/ref-kloqu?file=/ src/ App.vue
uj5u.com熱心網友回復：
由于我只看到一個帶有 ref as 的 div，請modelDiv嘗試使用以下選項之一并查看是否有效
this.elementHeight = this.$refs.modelDiv.$el.clientHeight
或者
this.elementHeight = this.$refs.modelDiv.clientHeight
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/349222.html
下一篇：如何在Cloudinary模塊的nuxt.config.ts中使用privateRuntimeConfig.env？