1. 引用表格时,自定义表格内容,用<template #default="scope"></template>
2.引用数字输入框,刚开始发现改变一个输入框的值,所有输入框的值跟着一起变,后来加上了<template #default="scope">,然后设置<el-input-number v-model="scope.row.volume">,就可以解决改变一个输入框引起所有都变的问题了。
//正确代码
<el-table :data="storetableData" style="width: 100%">
<el-table-column prop="buffer" label="存储" width="180" />
<el-table-column prop="mold" label="类型" width="180">
<template #default="scope">
<el-select v-model="scope.row.mold" class="m-2" placeholder="通用型云盘" size="small">
<el-option v-for="item in moldoptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</template>
</el-table-column>
<el-table-column prop="volume" label="容量">
<template #default="scope">
<el-input-number v-model="scope.row.volnum" :min="0" :max="100" :step="10" size="small" controls-position="right" />
</template>
</el-table-column>
<el-table-column prop="amount" label="数量" />
<el-table-column prop="overall" label="总性能" />
</el-table>
//数据
const storetableData = [
{
buffer: '系统盘',
mold: '通用型云硬盘',
volume: '10',
amount: '1',
overall: ''
},
{
buffer: '系统盘',
mold: '通用型云硬盘',
volume: '20',
amount: '2',
overall: ''
}
]