<body>
<div id="app">
<!-- 编译作用域就是 如果父组件模板 和 子组件模板 同时有 v-show指令
父组件模板只会找VUE实例里面的数据
子组件模板只会找子组件里面的数据
-->
<cpn v-show="isShow"></cpn>
</div>
<template id="cpn">
<div>
<h3>好好学习</h3>
<h4>天天向上</h4>
<button v-show="isShow">下一步</button>
</div>
</template>
<script src='https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.js'></script>
<script>
const app = new Vue({
el: '#app',
data: {
isShow: true,
},
components: {
cpn: {
template: "#cpn",
data() {
return {
isShow: false,
}
}
}
}
})
</script>
</body>