vue父子组件传值：props 和$emit

引用为父：

import eventToolBar from "./eventToolBar";（引用为父，所以这个组件为父组件）

props: ["page", "limit", "status", "deleteids"],（有props的组件为子组件）

props:父组件向子组件传值，先在父组件中动态绑定要传的值，（注意：如果传的值是字符串             可以不用加冒号动态绑定），然后在子组件中用props接受传过来的值

1.父组件中：<m-child :msg="'我是父組件傳過來的'" ></m-child>

2.子组件中接收msg:

export default {

        props: {

            msg: {

                type: String,

                default: ''

            },

        },

}

3.子组件中渲染msg:<h5>{{msg}}</h5>

或者在父组件中 ：

<event-tool-bar
  @search-result-arr="searchResultArr"
  @loading-list="loadingList"
  :page="page"
  :limit="limit"
  :status="formQuery.status"
  :deleteids="deleteids"
></event-tool-bar>

  在子组件中: 

props: ["page", "limit", "status", "deleteids"],

赋值获取： 

eventId: this.$props.deleteids

 

$emit:子组件向父组件传值,通过事件触发，先在子组件中注册点击事件，在事件中用                          this.$emit('自定义事件名字'，'要传给父组件的内容')，在父组件中接收自定义事件

1.子组件中：注册点击事件<button @click="btnMsg">点我传值给父组件</button>

2.子组件中：

methods: {

           btnMsg(){

               this.$emit('showMsg','我是子组件过来的值')

           }

        }

3.在父组件中接收自定义事件：<m-child @showMsg='showMsg'></m-child>,定义message,在自定义事件中给message赋值  this.message = val

export default {

        data() {

            return {

                message: ''

            }

        },

        methods: {

            showMsg(val) {

                this.message = val

            },

        }

    }