宜搭表格下单元格添加点击事件

• 场景宜搭单元格上没有点击事件，需要点击行，将这一行的某个字段带入到关联表单上进行赋值
• 点击单元格是关联表单没有点击事件，所以特意要给每行加点击事件，为了拿到这一行上的数据

• 表单 1

• 页面 JS

  /**
  * TableField onChange
  */
  export function onChangeTable({ value, extra }) {
  const { formGroupId } = extra || {};

  if (formGroupId) {
  this.getTableData();
  }else {
  setTimeout(() => {
  this.getTableData();
  }, 500);
  }

  }

  // 获取表格数据，给部件选配加点击事件
  export function getTableData() {
  // 获取表格
  var table = document.querySelector('.table-field-layout-table');
  // 获取表格中的所有行
  var rows = table.querySelectorAll('.table-field-table-row');

  for (var i = 0; i < rows.length; i++) {
  const tmpIndex = i;
  var cells = rows[i].querySelectorAll('.table-field-table-cell'); // 获取当前行的所有单元格
  for (var j = 0; j < cells.length; j++) {
  if (cells[j].querySelectorAll('.associationFormField_m053cs4m')) { // 检查单元格是否有类名 'xxx'
  cells[j].addEventListener('click', () => {
  // 这里编写点击事件的处理函数
  let data = this.$('tableField_m053cs3l').getValue();
  if (data[tmpIndex].textField_m053cs4l) {
  window.componentObj = {
  name: data[tmpIndex].textField_m053cs4l
  }
  } else {
  window.componentObj = {
  name: ""
  }
  }
  });
  }
  }
  }

  }

• 关联表单 2

• 页面 JS

  // 当页面渲染完毕后马上调用下面的函数，这个函数是在当前页面 - 设置 - 生命周期 - 页面加载完成时中被关联的。
  export function didMount() {
  console.log(「页面 JS」：当前页面地址 ${location.href});
  // 拿到名称进行赋值
  if (window.componentObj) {
  let tmpValue = window.componentObj.name;
  this.$('selectField_lpzh3j3y').setValue(tmpValue);
  }
  // console.log(「页面 JS」：当前页面 id 参数为 ${this.state.urlParams.id});
  // 更多 this 相关 API 请参考：https://www.yuque.com/yida/support/ocmxyv#OCEXd
  // document.title = window.loginUser.userName + ' | 宜搭';

  }