메소드를 사용하여 Vue.js에 조건부 스타일을 추가하는 방법은 무엇입니까?
P粉327903045
P粉327903045 2024-03-21 20:53:17
0
1
432

상위 컴포넌트에서 전달된 prop 값을 기반으로 하위 컴포넌트에 조건부 스타일을 추가하고 싶습니다.

다음은 조건부 스타일링의 실제 예입니다.

<li v-bind:class="[booleanValue ? 'stylingClassOne' : 'stylingClassTwo']"

하지만 이것은 내 스타일이 단일 변수를 기반으로 하고 두 개의 값(true/false)만 가질 수 있는 경우에만 작동합니다.

여러 값을 가질 수 있는 변수를 기반으로 조건부 스타일을 구현하고 싶습니다. 상위 구성 요소에서 하위 구성 요소로 문자열을 전달한다고 가정해 보겠습니다 stylingDecider,其值可以是 stylingClassOnestylingClassTwostylingClassThree.

그래서 저는 다음을 하고 싶습니다: <li v-bind:class="getStylingClass(stylingDecider)"> 但这确实不起作用。我需要一个方法来决定样式是什么的原因是因为其中会进行一些其他处理,这些处理将返回基于所述处理的类,所以我不能只使用 <li v-bind:class="stylingDecider" .

내가 뭘 잘못했나요? 조언 부탁드립니다. 감사합니다. 저는 Vue 3과 bootstrap-vue 3을 사용하고 있습니다.

P粉327903045
P粉327903045

모든 응답(1)
P粉653045807

방금 작동하는 코드 조각을 만들었습니다.

으아악 으아악 으아악
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿