IT이야기

Vue.js의 프로펠러에 값이 공급되는지 점검하십시오.

cyworld 2022. 4. 24. 09:40
반응형

Vue.js의 프로펠러에 값이 공급되는지 점검하십시오.

나는 데이터 속성에 기반한 배지를 보여주고 싶은 컴포넌트를 만들고 있다.데이터를 구성 요소에 공급하기 위해 나는 소품을 사용한다.이 소품이라고 불린다.status그리고 만약 있다면 그것은 있을 것이다.0또는1.

이제 그 값이 제시되어 있는지 확인하고 만약 제시되어 있다면 구성 요소에 html을 렌더링하고 싶다.이것을 하는 가장 좋은 방법은 무엇인가?데이터/값이 제공되지 않으면 html을 렌더링하지 않을 것이다.

HTML

<span>
    <div class="circle-small" :class="{ 'validated': tab.status }"></div>
</span>

그래서 나는 prop 'status'에 대한 데이터가 제공되어야만 이 html을 렌더링하고 싶다.나는 사용하려고 노력했다.v-if="tab.status"그러나 이렇게 함으로써 html은 다음 값이 될 때 렌더링되지 않을 것이다.status이다0.

사용required이와 같은 받침대에 있는 재산.

status: {
    Type: Boolean,
    required: true,
},

실제로 이 소품을 사용할 필요가 없기 때문에, 또한 작동하지 않을 것이다.

소품

status: {
    Type: Boolean,
},

좋은 해결책이 있는 사람?

기본값 설정null:

status: {
    Type: Boolean,
    default: null
},

이렇게 통과되었는지 확인할 수 있다.

status !== null

이것은 소품들이status통과되었다.

참조URL: https://stackoverflow.com/questions/51400329/check-if-a-value-is-supplied-to-a-prop-in-vue-js

반응형