반응형
틀렸나요?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
반응형
'IT이야기' 카테고리의 다른 글
Vue.js는 동일한 컴포넌트 문제의 여러 인스턴스 (0) | 2022.06.08 |
---|---|
fopen()의 r+와 w+의 차이 (0) | 2022.06.08 |
VueJ 상위 업데이트 시 하위 구성 요소가 업데이트되지 않도록 함 (0) | 2022.06.07 |
Vuex 스토어 내의 vue-i18n에서 $t를 사용하여 정적 문자열을 초기화하는 방법 (0) | 2022.06.07 |
Vuex 작업 유형을 알 수 없는 이유는 무엇입니까? (0) | 2022.06.07 |