<el-table-column prop="number" label="数量" align="center" > <template slot-scope="scope"> <el-input v-model="scope.row.number" type="number" size="mini" @change="handleChange" placeholder="请输入内容"></el-input> </template> </el-table-column>使用 element ui 中 表格 嵌套 输入框 ,下拉框等,会出现 无法 获取数据的情况,原因是嵌套的太深了 ![]() 可以看到,图片上标出的输入框,此时是无法输入得, 附上代码 <el-table-column prop="number" label="数量" align="center" > <template slot-scope="scope"> <el-input v-model="scope.row.number" type="number" size="mini" placeholder="请输入内 容"></el-input> </template> </el-table-column>可以在el-ipnut组件上使用 @input="() => $forceUpdate()" 使用强制更新,来让页面得输入框恢复正常 <el-table-column prop="number" label="数量" align="center" > <template slot-scope="scope"> <el-input v-model="scope.row.number" type="number" size="mini" @input="() => $forceUpdate()" placeholder="请输入内容"></el-input> </template> </el-table-column> 也可以在上面加一个change事件 handleChange(value) { console.log(value); this.$forceUpdate(); //强制刷新 }, |
|