vue2: 컴포넌트에 여러 개의 소품을 전달할 수 있습니까?

vue2: 컴포넌트에 여러 개의 소품을 전달할 수 있습니까?

온라인으로 문서나 예를 찾을 수 없습니다만, 컴포넌트에 여러 개의 소품을 전달하는 올바른 방법은 무엇입니까?

제가 시도한 것은 다음과 같습니다.

HTML로

<component:prop1="data1" :prop2="data2"></component>

component.displaces에 있습니다.

props: ['prop1','prop2'],

근데 안 먹히네...

좀 낡긴 했지만 저도 기여하고 싶어요."한 번에" 여러 가지 제안을 전달하려면 "v-bind"를 사용할 수 있습니다.

컴포넌트에 다수의 소품이 있다고 합시다.

props: ['age', 'year', 'date']

대신 다음과 같은 일반적인 방법을 사용합니다.

<MyAwesomeComponent :age="age" :year='year' :date='today' />

다음 작업도 가능합니다.

<MyAwesomeComponent v-bind="groupedProps" />

다음 개체를 "groupedProps"했습니다.

groupedProps: {age:134, year:2153, today: new Date()}

...v-bind="groupedProps"...

동작은 여기 vue docs에 설명되어 있습니다.

이런 컴포넌트에 여러 개의 소품을 전달할 수 있습니다.상위 구성 요소:

 <template>
   <div id="app">
     <child-component :propA=propa :propB=propb></child-component2>
   </div>
 </template>

 <script>
 import ChildComponent from './components/comp2'
 export default {
   name: 'app',
   components: {
     ChildComponent
   },
   data () {
     return {
       propa : 65,
       propb : 'Nitin'
     }
   }
 }
 </script>

 <style></style>

하위 구성 요소:

 <template>
   <div>
     {{propA}}
     {{propB}}
   </div>
 </template>

 <script>
 export default {
   props: {
     propA: Number,
     propB: String
   }

 }
 </script>

 <style lang="css">
 </style>

레퍼런스:
Vue Prop-Validation

편집:
자세한 내용과 예시 참조는 다음 URL에서 확인할 수 있습니다.
데이터를 자녀에게 전달하고 컴포넌트를 프로펠러로 전달

이 질문을 하고 싶으신가 봐요

인parent.js

props: ['prop1','prop2'],

부모 속성을 사용하여 일부 속성을 자식 구성 요소에 바인딩하려고 합니다.

child.js
props: ['prop11', 'prop21']

위의 질문이 맞는지 확인하고 싶을 뿐입니다.만약 그렇다면, 당신은 아래를 해야 합니다.

parent.js
data() {
   return {
     prop11: this.prop1,
     prop12: this.prop2
   }
}

and bind it
<child :prop1:"prop11" :prop2:"prop21"/>

언급URL : https://stackoverflow.com/questions/45729208/vue2-is-possible-to-pass-multiple-props-to-component