IT이야기

틀렸나요?v-bind 내부의 v-for와 동일한 요소의 일치 항목을 사용할 수 있습니까?

cyworld 2022. 6. 7. 21:34
반응형

틀렸나요?v-bind 내부의 v-for와 동일한 요소의 일치 항목을 사용할 수 있습니까?

매치마다 HTML을 몇 개 렌더링하려고 하는데 잘 모르겠어요.<match v-for='match in matches' v-bind:match='match'></match>사실 맞습니다.

구체적으로는, 이 기능을 사용할 수 있을지 어떨지 잘 모르겠습니다.v-bind:match='match'루프와 같은 요소에서v-for='match in matches'에 기재되어 있는 정보는match실제로 컴포넌트에 소품으로 보내지는가?

네, 포함되었습니다.다음으로 동작 예를 제시하겠습니다.

Vue.component('match', 
{
props :['match'],
template : `<div><span>{{match.matchName}}</span></div>`

})
var mapp = new Vue({
  el: "#app",
  data: {
    matches: [
      { matchName: "First Match"},
      { matchName: "Second Match"},
      { matchName: "Yet another Match"}
    ]
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.9/vue.js"></script>
<div id="app">
<match v-for='match in matches' v-bind:match='match'></match>
</div>

이 작업은 올바른 Vue 구문이며 작동합니다. match컴포넌트 내의 속성으로 사용 가능match.

그러나 변수의 이름을 변경할 수도 있습니다.이것은 한 줄의 코드이며, 이미 혼란스러워지기 시작합니다;-).

언급URL : https://stackoverflow.com/questions/57988541/is-match-v-for-match-in-matches-v-bindmatch-match-match-incorrect-can

반응형