Vue Js에서 메뉴 루프에 대한 활동 클래스를 동적으로 추가하는 방법은 무엇입니까?
P粉793532469
2023-08-25 20:24:48
<p>메뉴를 동적으로 표시하는 루프에 활성 클래스를 추가하는 방법은 무엇입니까? 열린 메뉴에 대한 활동 클래스를 설정할 수 없습니다. </p>
<pre class="brush:php;toolbar:false;"><a v-bind:href="module.route" class="nav-link">
//module.route는 데이터베이스 열입니다.
<i :class="module.icon" ></i>
//module.icon은 데이터베이스 열입니다.
<p>
{{ 모듈.이름 }}
//module.name은 데이터베이스 열입니다.
</p>
</li>
<p>데이터베이스의 메뉴 목록을 표시합니다. 이제 열린 메뉴를 활성화하고 싶습니다. </p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
제가 한 일입니다.
으아악추가하고 싶은 탭을 모두
으아악tabs라는 배열에 추가했습니다.이렇게 하면 배열의 각
탭에 대한<li>요소가 생성됩니다tabs中的每个tab创建一个<li>.모든 요소에는
으아악nav-link类，并且使用v-bind，如果变量active_tab等于tab，则会将active添加到元素的类列表中。每当用户点击其中一个选项卡时，使用@click将active_tab更改为用户点击的tab이 포함됩니다.스타일