子组件.vue
<template> <div> <el-table :data="comSchemaData" highlight-current-row height="517" @row-click="quoteProps"> <el-table-column label="schema名称" prop="name"> </el-table-column> </el-table> </div> </template>
子组件.ts
quoteProps(row) { this.$emit('toProps',row) }
父组件.vue
<com-schemas @toProps="toProps"></com-schemas>
注意:html中的toProps不带子组件传进来的参数,否则会报错,在ts中toProps的形参直接使用子组件传入参数即可
父组件.ts
import comProps from './comProps.vue';
@Component({
components: {
'com-props': comProps
},
)
export default class ExpandTable extends Vue {
toProps(row){
console.log(row);
}
}
本文介绍了一个Vue项目中子父组件之间的通信方法。通过一个具体的例子展示了如何在子组件中定义方法并在父组件中接收该方法传递的数据。具体实现包括了子组件中的表格点击事件触发并向父组件传递当前行数据。
342

被折叠的 条评论
为什么被折叠?



