vue 页面回显后台传回的数据,且页面数据不清空

本文介绍在使用Vue与JSP结合时,如何解决特定情况下input元素的值在页面重新加载后消失的问题。通过分析,发现是由于Vue的v-model指令导致的数据覆盖,并提出使用Vue.set方法来替代jQuery的赋值方式,有效避免了数据丢失。

当我们在用vue的时候,有的时候我们需要在jsp上回显从后台传回来的数据,但是这时候就会发现,大家利用

$("#").val();

这种方法给页面上的input赋值的时候,数据的确是赋值给了你想要的那个input中了,但是当我们再在这个页面中填数据的时候,你赋值的那个input的value就会消失,一开始以为是form表单给清空了,后来把form标签删掉了,还是出现了那个value值不见了的问题,经过测试,发现只有当

<input type="hidden" id="userId" name="userId"  v-model="vueObj.userId" />

在vue里面的时候才会出现,赋值的input的value消失,所以我猜测是new vue的时候,定义的那个model空的,所以每次都会利用v-model给input赋值为空,但是又不能把这个隐藏的input放在vue外边,如果放在外边的话,就没办法对他进行vue的操作,这时,我用了这样一种方法来替换$("#").val();这种方法,就是利用

Vue.set(target,key,value);

来给目标类中的对象赋值,这样就解决问题了!

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值