<script>
import data from './assets/post';
import DiscountSection from './Discount.vue';
export default {
name: 'App',
data() {
return {
clickedNum : 0,
isModalOpen: false,
신고수 : 0,
menus : ["Home", "Shop", "About"],
products : data,
}
},
methods: {
increase() {
this.신고수 += 1;
}
},
components: {
Discount : Discount,
}
}
</script>
<template>
<div class="discount">
<h4>지금 결제 하면 20 % 할인</h4>
</div>
</template>
<script>
export default {
name: 'DiscountSection',
}
</script>
<style>
.discount {
background: #eee;
padding: 10px;
margin: 10px;
border-radius: 5px;
}
</style>
<DiscountSection/>
중간에 들어가는 것 까지 확인 !
이 딴거 왜쓰는가 ?
<ModalWindow :products="products"/>
<script>
export default {
name: "ModalWidnow",
props : {
products : Array,
clickedNum : Number,
isModalOpen : Boolean,
}
}
</script>
<button @click="isModalOpen = false">닫기</button>