vue 父组件传值到子组件

父组件

<template>
  <div id="app">
    <img src="./assets/logo.png">

    <HelloWorld v-bind:users="users"/>
  </div>
</template>

<script>
import HelloWorld from './components/HelloWorld'

export default {
  name: 'App',
  data(){
    return {
      users:[
        {name:'zzs',age:34},
     {name:'ncy',age:35}
      ]
    }
  },
  components: {
    HelloWorld
  }
}
</script>

子组件

<template>
  <div>
    <p>{{ msg }}</p>
    <ul>
      <li v-for="user in users">{{user.name}}</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  //props:["users"],
  //标准写法是下面的对象写法
  props:{
    users:{
      'type':Array,
      required:true
    }
  },
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  }
}
</script>