vue 组件传值，（太久不用就会忘记，留在博客里，方便自己查看）

一 ：父组件 传值给 子组件

方法： props

//父组件
<template lang="html">
    <div>
        <h3>我是父亲</h3>
        <Children :patText="partentText"/>
    </div>
</template>

<script>
import Children from "./children"
export default {
    data () {
        return {
            partentText: "我是要给儿子的值"
        }
    },
    components: {
        Children
    },
    computed: {
    },
    methods:{
    }
}
</script>

//子组件
<template lang="html">
    <div>
        <h3>小儿子</h3>
        <p>展示父组件传递的值 {{ patText }}</p>
    </div>
</template>

<script>
export default {
    name: 'Children',
    data () {
        return {
        }
    },
    props:{
        patText:{
            type: String,//类型为字符窜
            default: "123"//默认类型
        }
    }
}

一 ：子组建 传值给 父组建  

方法： $emit 

//父组件
 1 <template lang="html">
    <div>
        <h3>我是父亲</h3>
        <Children @keyk="watchChild"/>
    </div>
</template>

<script>
import Children from "./children"
export default {
    data () {
        return {
        }
    },
    components: {
        Children
    },
    computed: {
    },
    methods:{
        watchChild(data) {
            console.log(data);
        }
    }
}
</script>

//子组件
<template lang="html">
    <div>
        <h3>小儿子</h3>
        <button @click="target">点击触发</button>
    </div>
</template>

<script>
export default {
    name: 'Children',
    data () {
        return {
            childText: "我将要给到父亲去"
        }
    },
    props:{
        patText:{
            type: String,//类型为字符窜
            default: "123"//默认类型
        }
    },
    methods:{
        target() {
            this.$emit('keyk',this.childText)
        }
    }
}
</script>

路由传值：

方法： $route.parms

注意是$route 不是 $router 

//路由
<router-link :to="{ name: '', params: {newsHeader: '消息'} }"></router-link>

//组件中获取
this.$route.parms.newsHeader