Vue ElementUI输入框绑定未定义的属性出错无法编辑
**v-model绑定输入框内容的时候,如果传入的是个未定义的属性,那么在代码里进行赋值初始化输入框内容的时候不能直接
obj.a='xxx'
这样值虽然插入了输入框,但是你会发现输入框会变得无法输入东西,需要用this.$set去赋值就不会出问题了。**
- template中(省去el-form等其他代码)
<el-input v-model="obj.a" placeholder="请输入" ></el-input>
- 上面输入框绑定的是obj对象的a属性
data代码(省去export default等其他代码)
data(){
obj:new Object()
}
- 经过上述直接绑定在初始化的时候修改数据以后再想用输入框输入会出现异常,输入无反应
例如初始化的时候修改了
created(){
//用ajax或者axios获取数据的部分代码就不写了,写个这个示意
this.obj.a='admin'
}
经过这么一顿操作,输入框看似有初始值了,但是你输入会发现输入没反应,正确初始化赋值方式如下
需要使用
created(){
//用ajax或者axios获取数据的部分代码就不写了,写个这个示意
this.$set(this.obj,'a','admin')
}
本文来自博客园,作者:HumorChen99,转载请注明原文链接:https://www.cnblogs.com/HumorChen/p/18039722
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
· 三行代码完成国际化适配,妙~啊~