el-radio在表格里面改变怎么能监听到

<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column prop="name" label="姓名" width="180">
    </el-table-column>
    <el-table-column label="性别" width="180">
      <template slot-scope="scope">
        <el-radio-group v-model="radioValue">
          <el-radio :label="scope.row.id" @change="handleRadioChange">男</el-radio>
          <el-radio :label="scope.row.id" @change="handleRadioChange">女</el-radio>
        </el-radio-group>
      </template>
    </el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [
        { id: 1, name: '张三', gender: 'male' },
        { id: 2, name: '李四', gender: 'female' }
      ],
      radioValue: ''
    };
  },
  watch: {
    radioValue(newValue, oldValue) {
      // 当radioValue变化时，会触发这个watcher
      console.log('Radio changed:', newValue);
    }
  },
  methods: {
    handleRadioChange(val) {
      // 当radio按钮改变时，这个方法会被调用
      console.log('Radio changed:', val);
    }
  }
};
</script>