填写缺失的部分,以便 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 ">切换灯光</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 ">切换灯光</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 ">切换灯光</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>