首页 > 解决方案 > 从父行提供表子行数据

问题描述

我需要知道单击子行时父行 ID 是什么,所以我的想法是为每个子行提供父行的 ID,以便我们可以通过这种方式获取数据。目前正试图在循环后端数据并为表格格式化每一行的代码中找到一种方法。

在此处输入图像描述

tableContent() {
      if (this.$store.state.models.models) {
        // store the function
        const mapper = (model) => ({
          name: model.children ? (
            <span class='model'>
              {model.year} {model.name} <span class='hide'>{model.id}</span>
              <button class='add-trim' onClick={this.addTrimDrawer}>
                <PlusIcon class='plus-icon' /> add trim
              </button>
            </span>
          ) : (
            <span class='edit-trim' onClick={this.editTrimDrawer}>
              {model.name} <span>{model.trim_id}</span>
              <EditIcon class='edit-icon' />
            </span>
          ),
          id: model.trim_id ? `trim-${model.trim_id}` : `model-${model.id}`,
          technical: model.children ? null : <ChecklistIcon class='tech checklist-icon' />,
          customer_delivery: model.children ? null : <ChecklistIcon class='cd checklist-icon' />,
          customer_acceptance: model.children ? null : <ChecklistIcon class='ca checklist-icon' />,
          off_the_truck: model.children ? null : <ChecklistIcon class='oft checklist-icon' />,
          vim: model.children ? null : <ChecklistIcon class='vim checklist-icon' />,
          // use it for children, if there are any
          children: model.children?.map(mapper),
        });

        // use it for the models
        this.tableData = this.$store.state.models.models.map(mapper);
      }
    },

标签: javascriptvue.jshtml-tabledatatableelement-ui

解决方案


推荐阅读