Vue 2에서 동적 클래스 이름과 조건부 클래스 이름 혼합

Vue 2에서 동적 클래스 이름과 조건부 클래스 이름 혼합

예를 들어 내가 클래스 있는 div를 원한다고 가정해 보자.a0로.a9v-for 및 클래스의 인덱스에 따라b조건부로

따로따로 하면 다음과 같습니다.

<div v-for="(val, index) in array" :class="'a' + index"></div>

그리고.

<div v-for="(val, index) in array" :class="{'b': index===1}"></div>

이 기능이 동작하지 않는 것을 고려하면, 이것들을 조합하면 다음과 같이 됩니다.

<div v-for="(val, index) in array" :class="{'a' + index: true, 'b': index===1}"></div>

최적의 (실효 솔루션)은 다음과 같습니다.

<div v-for="(val, index) in array" :class="'a' + index + ' ' + (index===1?'b':'') }"></div>

더 좋은 방법은 없을까?고마워요.

<div v-for="(val, index) in array" :class="['a'+index, {b: index === 1}]"></div>

또는

<div v-for="(val, index) in array" :class="['a'+index, index === 1 ? 'b' : '']"></div>

데모를 확인해 주세요.

언급URL : https://stackoverflow.com/questions/45544272/mixing-dynamic-and-conditional-class-name-in-vue-2