vue传值

1、父组件向子组件传值

 父组件获取到数据

<searchHeader v-bind:lists="student.list" ></searchHeader>

子组件

<ul>
    <li v-for="(item,index) in lists" key="index">
        <p>{{item.name}}</p>
        <span>{{item.address}}</span>
    </li>
</ul>

export default {
  name: 'searchHeader',
  //props:["lists"]
  props:{
    lists:{
       type:Array,
       required:true
    }
  }
}

注：当传的值是引用类型的时候，只要一个地方发生变化所有的地方都会发生变化；当传的值是基本数据类型的时候，改变那个地方，那个地方变，其他的不会跟随变动。

2、 子组件向父组件传值（事件传值）

 子组件，searchInput就是子组件要向父组件传的值（input的值）

父组件

在父组件引入并注册

import SearchHeader from '@/components/common/searchHeader';

export default {
  components: {
      Footer,
      SearchHeader,
    },
}