vue-cli3 + ts @Emit，@Prop父子组件之间传值

@Emit和@Prop属于vue-property-decorator库，使用时需要先导入

import { Component, Vue, Prop, Emit } from "vue-property-decorator";

1.父组件向子组件传值：

父组件代码：

子组件代码：

注意：：：如果是父组件向子组件动态传值（即变量）需要做以下更改：

子组件中接收变量的值需要有一个默认值，比如上面子组件中的代码：

 @Prop(String) 
 private parentValue: string = ""; // 这里默认给了一个空值

同时需要对这个变量进行监听，监听其变化：

@Watch("parentValue")
private onParentValue(newValue: any) {
    // 输出变化后的值
    console.log(newValue);
}

2.子组件向父组件传值

子组件代码：

父组件代码：

如果要传递多个值，建议把这多个值封装成一个对象，然后一块传递。如：

// 子组件
@Emit()
private test() {
    // 要传给父组件的多个值
    const params = {
        param1: value1,
        param2: value2,
        // ......
    };
    return params;
}