vue项目elementui中input无法输入解决办法

vue项目中elementui使用input进行数据展示和编辑时,数据无法正常录入是什么原因呢?

题复现:

    vue项目elementui中input编辑数据,将从后台获取的数据展示在input中,但进行编辑时却不能修改input中的值。

出现问题原因分析:

    数据初始化时,没有设置key值,设置了值,才能生效get,set。

input无法编辑解决办法,在data中初始化数据即可,如test

<el-input type="textarea" v-model="test"></el-input>
<script>
export default {
data() {
return {
test:''
};
},
onLoad(){
let _this = this
//模拟请求数据
setTimeout(function(){
_this.test = '123'
},2000)
},
methods: {}
}
</script>

错误方式:

<el-input type="textarea" v-model="test"></el-input>
<script>
export default {
data() {
return {};
},
onLoad(){
let _this = this
//模拟请求数据
setTimeout(function(){
_this.test = '123'
},2000)
},
methods: {}
}
</script>

正确和错误展示对比差异,错误的方式在data中没有初始化test值。需要在data中初始化值,input才可以正常进行编辑操作。

六月初字帖坊小程序 你想要的字帖模板及工具,这里都有!