vue 父组件向子组件传递对象

父组件向子组件传递一个对象,子组件将其展示出来

子组件展示时,遍历对象使用v-for

    <div v-for="v,k in stu">
      {{k}}:{{v}}
    </div>

fa

<template>
  <div>
    <son :stu="stu"></son>
  </div>
</template>

<script>
  import son from './Son'

  export default {
    name: "father",
    data() {
      return {
        stu: {
          name: 'aaa',
          age: 16,
          class: 'cs64'
        }
      }
    },
    components: {
      son,
    }
  }
</script>

son

<template>
  <div>
    <div v-for="v,k in stu">
      {{k}}:{{v}}
    </div>
  </div>
</template>

<script>
  export default {
    name: "son",
    props: ['stu'],
  }
</script>

猜你喜欢

转载自my.oschina.net/ahaoboy/blog/1626033