部分代碼如下：
父組件：
<coupon :modifyFlag.sync="flag" />
data() {
return {
flag:0
};
子組件:
<div class="receive" @click="changeTest">領取</div>
import Vue from "vue";
import { Component, Prop, Emit } from "vue-property-decorator";
@Component({
name: "Coupon",
filters: {
timeFormat(input: any) {
input = input.replace(/\-/g, "/"); //橫杠的時間不能被識別，所以要替換程斜杠
let time = new Date(input);
let year = time.getFullYear(); //年
let month = time.getMonth() + 1; //月
let day = time.getDate(); //日
return `${year}年${month}月${day}日`;
}
}
})
export default class Coupon extends Vue {
//定義props，括號的是JS類型，冒號后是TS類型，嘆號是必傳值，問號是可選值
@Prop({ default: [] }) list!: [];
//這里可以正常定義生命周期函數
created() {
this.list.forEach((item: any) => {
this.$set(item, "showRole", false);
});
}
changeTest(){
this.changeFlag(20);
}
//如果有參數但是元素事件上沒有參數的時候，可以單獨封裝一下，交給調用函數傳參
@Emit('update:modifyFlag')
changeFlag(n:number){
n=19;
console.log(n);
}
}
參考：