关键词搜索

源码搜索 ×
×

Web前端笔记-解决Vue编写的输入框(input、textarea等)使用JS设置value时提交表单无效的问题

发布2022-02-07浏览1902次

详情内容

主要的原因是vue相当于套了一层,界面上的输入框会关联model,提交表单的时候,他是直接提交model的值,而不是传统的输入框里面的值。

所以用这种:

  1. let textAreaItem = document.getElementsByTagName("textarea")[0];
  2. textAreaItem.value = "XXXXXXXXXXXXXX";

此时界面上已经有值了,可能数据点下输入框,数据消失,也可能不消失。

提交按钮按下后,要不就是前端提示没值,要不就是后端提示送来的值为空。

这里就是因为那个model的问题。

只需要把事件关联上就可以了:

  1. const event = document.createEvent('HTMLEvents');
  2. event.initEvent('input', false, true);
  3. textAreaItem.dispatchEvent(event);

这样前端就不会提示没数据,后端也能拿到数据了。

相关技术文章

点击QQ咨询
开通会员
返回顶部
×
微信扫码支付
微信扫码支付
确定支付下载
请使用微信描二维码支付
×

提示信息

×

选择支付方式

  • 微信支付
  • 支付宝付款
确定支付下载