Vue 组件传值

        回想一下用Vue开发也有一年多了，但一直没有系统的整理一下相关知识，最近不太忙就总结一下在开发过程中所遇到的一些坑。今天主要总结一下Vue组件传值的几种常用方法：

1、通过路由带参数传值

   ① A组件通过query把id传给B组件          

this.$router. push({path: '/B',query:{id: 1}})

  ② B组件接收  

this.$route.query.id

2、父组件向子组件传值

使用props向子组件传递数据

子组件部分：child.vue

< template>

< div>

< ul>

< li v-for='(item,index) in nameList' :key='index'>{ {item.name}}</ li>

</ ul>

</ div>

</ template>

< script>

export default {

props:[ 'nameList']

}

</ script>

父组件部分：

< template>

< div>

< div>这是父组件</ div>

< child :name-list='names'></ child>

</ div>

</ template>

< script>

import child from './child.vue'

export default {

components:{

child

},

data(){

return{

names:[

{name: