elementUI中input框无法输入的问题及原因
程序员文章站
2022-06-07 13:38:02
...
错误,无法输入
<el-table-column prop="name" label="输入">
<el-input v-model="input1" placeholder="姓名"></el-input>
</el-table-column>
正确,可以输入
<el-table-column prop="name" label="输入">
<template slot-scope="scope">
<el-input v-model="scope.row.name" placeholder="姓名"></el-input>
</template>
</el-table-column>
猜测是table每行数据不能用全局变量,需指定每一行的变量
完整示例
<template>
<div id="app">
<el-table :data="tabletest" ref="multipleTable">
<el-table-column prop="name" label="输入">
<template slot-scope="scope">
<el-input v-model="scope.row.name" placeholder="姓名"></el-input>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
var inp="";
export default {
name: 'App',
data(){
return{
tabletest:[{
name:"hello"
},{
name:"vue"
}
],
}
},
}
</script>
<style>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
推荐阅读