我一直在尝试显示我的模式,但出于某种原因它一直说该属性未定义,即使我已经在 Data()
我觉得我遗漏了一些对我理解这一切如何运作至关重要的东西......
该属性在加载时定义为 false
,在单击按钮时应变为 true
。
<template>
<div class="product-item">
<h3>{{product.name}}</h3>
<p>{{product.tagline}}</p>
<img class="product-image" :src="product.image_url">
<p>PH: {{product.ph}}</p>
<button class="show-modal" @click="showModal = true">Show a tip</button>
<modal v-if="showModal" @close="showModal = false"></modal>
</div>
</template>
<script>
import Modal from "@/components/Modal.vue";
export default {
components: {
Modal
},
Data() {
showModal: false
},
props: {
product: {
type: Object
}
},
methods: {},
computed: {},
mounted() {}
};
</script>
最佳答案
你的数据对象应该通过像这样的函数返回:
data(){
return{
showModal: false
}
}
data
应该是小写的。
关于javascript - Vue.JS 数据属性未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57373602/