# Vue에서 props를 문자열로 component로 전달(props as string or integer/increment example)
4117 단어 Vue.js
해결됨
콜론:bind로 하위 구성 요소에 props 전달<template>
<div>
- <Counter count="1"/>
- <Counter count="2"/>
- <Counter count="3"/>
+ <Counter :count="1"/>
+ <Counter :count="2"/>
+ <Counter :count="3"/>
</div>
</template>
bind가 아니더라도 프로부터 줄 수 있는 게 뭘까요?
Code
pages/counter-three.vue<template>
<div>
<Counter count="1"/>
<Counter count="2"/>
<Counter count="3"/>
</div>
</template>
<script>
import Counter from '~/components/Counter.vue'
export default {
components: {
Counter
}
}
</script>
components/Counter.vue<template>
<div>
<h2>
Count: {{ count }}
</h2>
<input type="button" @click="incrementCounter" value="Increment!">
</div>
</template>
<script>
export default {
props: {
count: {
type: Number,
default: 1
},
},
methods: {
incrementCounter (e) {
this.count = this.count + 1
}
}
}
</script>
증가하면 문자가 증가합니다.
Original by Github issue
Reference
이 문제에 관하여(# Vue에서 props를 문자열로 component로 전달(props as string or integer/increment example)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/YumaInaura/items/da54d2101a4cb36400b2
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
<template>
<div>
- <Counter count="1"/>
- <Counter count="2"/>
- <Counter count="3"/>
+ <Counter :count="1"/>
+ <Counter :count="2"/>
+ <Counter :count="3"/>
</div>
</template>
pages/counter-three.vue
<template>
<div>
<Counter count="1"/>
<Counter count="2"/>
<Counter count="3"/>
</div>
</template>
<script>
import Counter from '~/components/Counter.vue'
export default {
components: {
Counter
}
}
</script>
components/Counter.vue<template>
<div>
<h2>
Count: {{ count }}
</h2>
<input type="button" @click="incrementCounter" value="Increment!">
</div>
</template>
<script>
export default {
props: {
count: {
type: Number,
default: 1
},
},
methods: {
incrementCounter (e) {
this.count = this.count + 1
}
}
}
</script>
증가하면 문자가 증가합니다.Original by Github issue
Reference
이 문제에 관하여(# Vue에서 props를 문자열로 component로 전달(props as string or integer/increment example)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/YumaInaura/items/da54d2101a4cb36400b2
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(# Vue에서 props를 문자열로 component로 전달(props as string or integer/increment example)), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/YumaInaura/items/da54d2101a4cb36400b2텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)