父组件向子组件传参

1、子组件通过属性名的方式接收父组件的传参

1.1、父组件向子组件传参

<!--父组件向子组件传参，参数名comments-->
<list :comments="comments"></list>

1.2、子组件通过属性名接收父组件的传参

<script>
import Item from './Item'
export default {
  components: {
    Item
  },
  props: ['comments'] // 属性名的方式接收父组件传参
}
</script>

1.3、在子组件中使用从父组件接收过来的传参

<ul class="list-group">
      <item v-for="(comment, idx) in comments" :key="idx" :comment="comment"></item>
</ul>

2、子组件通过属性名和属性类型的方式接收父组件的传参

2.1、父组件向子组件传参

<!--父组件向子组件传参，参数名comment-->
<item v-for="(comment, idx) in comments" :key="idx" :comment="comment"></item>

2.2、子组件通过属性名和属性类型的方式接收父组件的传参

<script>
export default {
  props: {
    comment: Object // 属性名和属性类型的方式接收父组件的参数
  }
}
</script>

2.3、在子组件中使用从父组件接收过来的传参

<p class="user"><span >{{comment.name}}</span><span>说:</span></p>
<p class="centence">{{comment.content}}</p>