본문 바로가기

기타/vue js

vue js props 여러개 데이터 송수신하기

728x90

부모 컴포넌트

<template>
  <div>
    <div v-for="value in name" v-bind:key="value">
          <Navbar v-bind:names="value" :ab="a"></Navbar>
    </div>
  </div>
</template>

<script>
export default {
  data: function () {
    return {
      name :[1,2,3,4,5],
      a :100
    } 
  }
}
</script>

v-bind를 여러 개 사용해 여러 개의 데이터를 보낼 수 있습니다.

 

자식 컴포넌트

<template>
	{{names}}
    {{ab}}
</template>

<script>
export default {
	props:['names','ab']
}
</script>

<style>

</style>
728x90