vue 如何获取scope 所在行数，并且动态的给表格中的scope.row赋值scope.$index

vue scope.row 动态赋值

把scope.$index存为全局变量
通过 this. $re f s . sco p eD a t a . d a t a [t hi s . sco p e d I n d e x] 获取表信息（ t hi s . sco p e d I n d e x 是我保存的全局的 sco p e .$ index），然后赋值，案例如下


<template><div class="app-container"><el-row :gutter="10" class="mb8"><el-col :span="1.5"><el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"v-hasPermi="['business:signConfig:add']">新增</el-button></el-col><!--      <el-col :span="1.5">--><!--        <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"--><!--          v-hasPermi="['business:signConfig:edit']">修改--><!--        </el-button>--><!--      </el-col>--><!--      <el-col :span="1.5">--><!--        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"--><!--          v-hasPermi="['business:signConfig:remove']">删除--><!--        </el-button>--><!--      </el-col>--><right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar></el-row><el-table v-loading="loading" :data="signConfigList" @selection-change="handleSelectionChange"><el-table-column type="selection" width="55" align="center"/><el-table-column label="ID" align="center" prop="id"/><!--      <el-table-column label="${comment}" align="center" prop="dayDate" />--><el-table-column label="签到天数" align="center" prop="dayDate"/><el-table-column label="显示名称" align="center" prop="dayDesc"/><!--      <el-table-column label="奖励列表，对应的是道具表的id" align="center" prop="itemIdList" />--><el-table-column label="操作" align="center" class-name="small-padding fixed-width"><template slot-scope="scope"><el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"v-hasPermi="['business:signConfig:edit']">修改</el-button><el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"v-hasPermi="['business:signConfig:remove']">删除</el-button></template></el-table-column></el-table><pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"@pagination="getList"/><!-- 添加或修改签到配置对话框 --><el-dialog :title="title" center :visible.sync="open" width="800px" append-to-body><el-form ref="form" :model="form" :rules="rules" label-width="80px"><el-form-item label="签到天数" prop="dayDate"><el-input v-model="form.dayDate" :maxlength="5" placeholder="请输入签到天数"/></el-form-item><el-form-item label="显示名称" prop="dayDesc"><el-input v-model="form.dayDesc" type="text" show-word-limit :maxlength="100" placeholder="请输入显示名称"/></el-form-item><el-divider content-position="center">奖励</el-divider><el-row :gutter="10" class="mb8"><el-col :span="1.5"><el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAddAppItemConfig">添加</el-button></el-col><el-col :span="1.5"><el-button type="danger" icon="el-icon-delete" size="mini" @click="handleDeleteAppItemConfig">删除</el-button></el-col></el-row><el-table  ref="scopeData" :data="appItemConfigList" :row-class-name="rowAppItemConfigIndex"@selection-change="handleAppItemConfigSelectionChange" ><el-table-column type="selection" align="center"/><el-table-column label="序号" align="center" prop="index" width="50"/><!--          <el-table-column label="道具id" prop="name" width="150">--><!--            <template slot-scope="scope">--><!--              <el-input v-model="scope.row.name" placeholder="请输入道具名称" />--><!--            </template>--><!--          </el-table-column>--><el-table-column label="道具id" prop="itemId"><template slot-scope="scope"><el-input v-model="scope.row.itemId" placeholder="请选择道具id" @focus="getItemListDataDisable(scope.$index,scope)"></el-input></template></el-table-column><el-table-column label="道具名字" prop="itemName"><template slot-scope="scope"><el-input v-model="scope.row.itemName" disabled="true" placeholder="请输入道具名字"></el-input></template></el-table-column><el-table-column label="奖励数量" prop="count"><template slot-scope="scope"><el-input v-model="scope.row.count"  autocomplete="off" placeholder="请输入正整数数值"@keyup.native="scope.row.count=test(scope.row.count)?scope.row.count:''"/></template></el-table-column></el-table></el-form><div slot="footer" class="dialog-footer"><el-button type="primary" @click="submitForm">确 定</el-button><el-button @click="cancel">取 消</el-button></div></el-dialog><el-dialog title="选择道具" :visible.sync="open2" width="800px" append-to-body><el-table   v-loading="loading" :data="itemConfigList" highlight-current-row @current-change="handleCurrentChange"><el-table-column label="道具ID" align="center" width="100" prop="itemId"/><el-table-column label="道具名称" align="center" prop="name"/><el-table-column label="道具类型" align="center" width="100" prop="itemType"><template v-slot="scope"><span v-if="scope.row.itemType==1">食物</span><span v-if="scope.row.itemType==2">日用品</span><span v-if="scope.row.itemType==3">肥料</span><span></span></template></el-table-column><el-table-column label="道具描述" align="center" :show-overflow-tooltip="true" prop="itemDesc"/></el-table><div slot="footer" class="dialog-footer"><el-button type="primary" @click="submitForm2">确 定</el-button><el-button @click="open2=false">取 消</el-button></div></el-dialog></div>
</template><script>
import {listSignConfig,getSignConfig,delSignConfig,addSignConfig,updateSignConfig
} from "@/api/business/signConfig";
import {getAllItemConfig
} from "@/api/business/itemConfig";export default {name: "SignConfig",data() {return {scopedIndex:"",itemConfigList: "",selectData: "",open2: false,//道具下拉列表itemSelectData: [],// 遮罩层loading: true,// 选中数组ids: [],// 子表选中数据checkedAppItemConfig: [],// 非单个禁用single: true,// 非多个禁用multiple: true,// 显示搜索条件showSearch: true,// 总条数total: 0,// 签到配置表格数据signConfigList: [],// 道具配置表格数据appItemConfigList: [],// 弹出层标题title: "",// 是否显示弹出层open: false,// 查询参数queryParams: {pageNum: 1,pageSize: 10,dayDate: null,dayDesc: null,itemIdList: null},// 表单参数form: {},// 表单校验rules: {dayDate: [{required: true,message: "天数不能为空",trigger: "blur"},{validator: (rule, value, callback) => {if (/^(?:[1-9]\d*)$/.test(value) == false) {callback(new Error("请输入正整数"))} else {return callback()}},trigger: 'blur',}],scopedData:"",dayDesc: [{required: true,message: "显示名称不能为空",trigger: "blur"}],}};},created() {this.getList();this.getItemSelectData()},methods: {test(num) {debuggervar reg = /^\d+$/if (!num.match(reg)) {return false} else {return true}},/** 查询签到配置列表 */getList() {this.loading = true;listSignConfig(this.queryParams).then(response => {this.signConfigList = response.rows;this.total = response.total;this.loading = false;});},submitForm2(){debuggerthis.$refs.scopeData.data[this.scopedIndex].itemId= this.selectData.itemIdthis.$refs.scopeData.data[this.scopedIndex].itemName= this.selectData.namethis.open2=false;},// 取消按钮cancel() {this.open = false;this.reset();},// 表单重置reset() {this.form = {id: null,dayDate: null,dayDesc: null,itemIdList: null};this.appItemConfigList = [];this.resetForm("form");},// oninput(count){//   return count=count.replace(/\D/g, '')// },/** 搜索按钮操作 */handleQuery() {this.queryParams.pageNum = 1;this.getList();},/** 重置按钮操作 */resetQuery() {this.resetForm("queryForm");this.handleQuery();},// 多选框选中数据handleSelectionChange(selection) {this.ids = selection.map(item => item.id)this.single = selection.length !== 1this.multiple = !selection.length},/** 新增按钮操作 */handleAdd() {this.reset();this.open = true;this.title = "添加签到配置";},/** 修改按钮操作 */handleUpdate(row) {this.reset();const id = row.id || this.idsgetSignConfig(id).then(response => {this.form = response.data;this.appItemConfigList = response.data.appItemConfigList;this.open = true;this.title = "修改签到配置";});},getItemListDataDisable(index){this.open2=true;this.scopedIndex=index;},/** 提交按钮 */submitForm() {this.$refs["form"].validate(valid => {if (valid) {this.form.appItemConfigList = this.appItemConfigList;if (this.form.id != null) {updateSignConfig(this.form).then(response => {this.$modal.msgSuccess("修改成功");this.open = false;this.getList();});} else {addSignConfig(this.form).then(response => {this.$modal.msgSuccess("新增成功");this.open = false;this.getList();});}}});},/*** 获取道具的下拉选框**/// getSelectData() {//// },handleCurrentChange(val){this.selectData=val;},/** 删除按钮操作 */handleDelete(row) {const ids = row.id || this.ids;this.$modal.confirm('是否确认删除签到配置编号为"' + ids + '"的数据项？').then(function () {return delSignConfig(ids);}).then(() => {this.getList();this.$modal.msgSuccess("删除成功");}).catch(() => {});},/** 道具配置序号 */rowAppItemConfigIndex({row,rowIndex}) {row.index = rowIndex + 1;},/** 道具配置添加按钮操作 */handleAddAppItemConfig() {let obj = {};obj.name = "";obj.itemId = "";obj.itemName = "";obj.count = "";obj.itemSubType = "";obj.icon = "";obj.itemDesc = "";obj.single = "";obj.getMaxAcount = "";obj.mask = "";obj.effect = "";this.appItemConfigList.push(obj);},//获取下拉道具下拉选款数据getItemSelectData() {getAllItemConfig().then(res => {if (res.code === 200) {this.itemConfigList = res.data;}})},/** 道具配置删除按钮操作 */handleDeleteAppItemConfig() {if (this.checkedAppItemConfig.length == 0) {this.$modal.msgError("请先选择要删除的道具配置数据");} else {const appItemConfigList = this.appItemConfigList;const checkedAppItemConfig = this.checkedAppItemConfig;this.appItemConfigList = appItemConfigList.filter(function (item) {return checkedAppItemConfig.indexOf(item.index) == -1});}},/** 复选框选中数据 */handleAppItemConfigSelectionChange(selection) {this.checkedAppItemConfig = selection.map(item => item.index)},/** 导出按钮操作 */handleExport() {this.download('business/signConfig/export', {...this.queryParams}, `signConfig_${new Date().getTime()}.xlsx`)}}
};
</script>