HTML部分，我想在两个位置激活移动部分
<i @click="mobileClick" :class="[{ 'bi-x': menuOpen }, { 'bi-list': !menuOpen },'mobile-nav-toggle', 'bi']"></i>
点击切换类时调用的JS函数
setup(){
let menuOpen= false
const mobileClick = () =>{
menuOpen = !menuOpen
console.log(menuOpen)
}
return{mobileClick, menuOpen}
}
布尔值在点击时更新，但类不...我是不是要重新渲染什么的？
您的属性应定义为一个ref，该属性由脚本中的value字段访问：
import {ref} from 'vue';
export default {
setup(){
const menuOpen= ref(false)
const mobileClick = () =>{
menuOpen.value = !menuOpen.value
console.log(menuOpen.value)
}
return{mobileClick, menuOpen}
}
}
在模板中不需要使用value字段：
<i @click="mobileClick" :class="[{ 'bi-x': menuOpen }, { 'bi-list': !menuOpen },'mobile-nav-toggle', 'bi']"></i>
