Vuejs에서 동적 요소와 함께 v-show를 사용하는 방법

Vuejs에서 동적 요소와 함께 v-show를 사용하는 방법

테이블의 열과 행이 동적으로 렌더링되는 동적 테이블 렌더링이 있습니다.

그래서 여기 나는 두 명의 형제가 있다.<td>각 행의 요소:

<td :key="`td3-${index}`" :id="`show_${key}`" v-show="`show_${key}`">
  <input type="text" :v-model="key" :name="key" :value="entry[key]" />
</td>
<td :key="`td4-${index}`">
  <a href="#" @click="showField(key)">Edit</a>
</td>

에서onclick두 번째 링크 이벤트<td>첫 번째를 보여주고 숨겨야 해<td>요소.역동적이기 때문에 여러 행이 있을 것입니다.그래서 저는 제 데이터에 다이내믹 부울을 선언했습니다.<td>다른 사람의 클릭에 근거해<td>같은 줄에

v-show="`show_${key}`"- 동적 키를 사용하여 속성을 표시합니다.

  show_firstname: false,
  show_lastname: false,
  show_email: false,
  show_orgname: false

다음 각 항목에 대해 별도의 부울 요소를 생성했습니다.<td>각 행에 있습니다.

하지만 내가 그 가치를 바꿀 때마다v-show두 번째 클릭을 할 수 있는 재산<td>그건 아무런 차이가 없어요그래서 나는 그 사진을 보여주거나 숨길 수 없었다.<td>.아마도요.v-show걸린다"`show_${key}`"true 또는 false를 올바르게 치환하지 않는 문자열 값으로 지정합니다.어떻게 하면 이 일을 할 수 있을까요?

프로퍼티의 플랫리스트가 아닌 오브젝트로 show_를 정리해 보는 것은 어떨까요?

https://codesandbox.io/embed/vue-template-csncc?fontsize=14&hidenavigation=1&theme=dark

언급URL : https://stackoverflow.com/questions/58835626/how-to-use-v-show-with-dynamic-element-in-vuejs