비활성화/활성화 버튼의 경우 VueJs v-if

비활성화/활성화 버튼의 경우 VueJs v-if

저의 활용 사례는 이런 것입니다.

1. html이 있습니다.<p>ID가 "displicate"인 요소입니다.
2. 나는 그것을 읽고 싶다.<p>을 통해 요소화하다.v-if그리고 그 안에 있는 가치가

   "EXPIRED"와 동일한 요소를 삭제하려고 합니다.disabled[속성]을 클릭합니다.

나중에 사용 사례에 대해 설명하겠습니다. 처음에 버튼을 비활성화하고 해당 단락의 상태가 EXPIRED로 업데이트되면 버튼에서 비활성화된 부품을 제거합니다.

다음을 사용하여 이 작업을 수행하는 방법

1. 계산된 특성/감시자
2. v-if

<template lang="html">
  <div class="">
    <p id="demo"></p>
    <button type="button" name="button" class="btn btn-primary" disabled>Start</button>
  </div>
</template>

비 Vue DOM 조작을 사용하여 이 EXPIRED 항목을 설정하는 경우 손실됩니다.그걸 Vue랑 섞지 마.대신 이렇게 하겠습니다.

<template lang="html">
  <div class="">
    <p id="demo">{{ status }}</p>
    <button type="button" name="button" class="btn btn-primary" :disabled="status !== 'EXPIRED'">Start</button>
  </div>
</template>

status에서 VM의 속성이 되는 것data()기능.

언급URL : https://stackoverflow.com/questions/49376166/vuejs-v-if-for-disable-enable-buttons