vue 动态表头,动态数据,可编辑


<el-table
              :data="tableData"
              border
              class="tb-edit"
              style="width: 100%"
              highlight-current-row
              @row-click="handleCurrentChange"
            >
              <el-table-column
                align="center"
                width="180"
                :label="item.type_name"
                :prop="item.id"
                v-for="(item, index) in attr"
                :key="index"
              >
                <template slot="header" slot-scope="scope">
                  <el-input
                    size="small"
                    v-if="scope"
                    v-model="item.attr_value"
                    :placeholder="'请输入' + item.type_name"
                    @input="bigInput(item)"
                  ></el-input>
                </template>
                <el-table-column
                  :prop="item.id"
                  :label="item.type_name"
                  width="180"
                  align="center"
                >
                  <template scope="scope">
                    <el-input
                      size="small"
                      v-model="scope.row[attr[index].type_name + '_value']"
                      :placeholder="'请输入' + item.type_name"
                      @change="handleEdit(scope.$index, scope.row)"
                    ></el-input>
                  </template>
                </el-table-column>
              </el-table-column>
            </el-table>
 

 

 

 

 

 

 

 

 

 

 

 

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM