填写缺失的部分,以便 Vue 根据“lightOn”布尔数据属性为我们切换下面 <div> 标签的可见性。
<div id="app">
<div id="lightDiv">
<div @(6)="lightOn"></div>
<img src="img_lightBulb.svg">
</div>
<button v-on:click=" lightOn =! lightOn ">Switch light</button>
</div>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
const app = Vue.createApp({
data() {
return {
lightOn: false
}
}
})
app.mount('#app')
</script>
<div id="app">
<div id="lightDiv">
<div v-show="lightOn"></div>
<img src="img_lightBulb.svg">
</div>
<button v-on:click=" lightOn =! lightOn ">Switch light</button>
</div>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
const app = Vue.createApp({
data() {
return {
lightOn: false
}
}
})
app.mount('#app')
</script>
<div id="app">
<div id="lightDiv">
<div v-if="lightOn"></div>
<img src="img_lightBulb.svg">
</div>
<button v-on:click=" lightOn =! lightOn ">Switch light</button>
</div>
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script>
const app = Vue.createApp({
data() {
return {
lightOn: false
}
}
})
app.mount('#app')
</script>