使用jQuery设置Vue.js表单中的值

Question

我有一个巨大的表单，它在一个外部网站上(不控制源代码)，是用Vue.js创建的。我正在尝试使用控制台批量更新此表单。当我尝试使用jQuery更改字段的值时，如下所示

$('#build-table-body').find('.input-group__input input:eq(3)').val('222')

我可以让输入中的值进行更改，但它实际上并不持久。当我移动到另一个字段或提交表单时，这些值就会恢复到以前的状态。

如果有帮助，该网站正在使用vue.js 2.5.2，vuetify和vuex。我无法共享站点，因为它只能通过VPN访问。会非常感谢你的帮助。

Answer 1

您可以访问vue实例和数据部件https://stackoverflow.com/a/58500685/3559256

如果您的数据是vuex格式的，请尝试应用相同的技巧。

在https://codesandbox.io/s/l3p6kjo7pl上试试

$v = document.getElementById('app').__vue__
$v._data.firstName = "ccc"

​

​

Answer 2

这是vue应用程序/组件的预期行为。发生的情况是，当您使用jQuery时，您正在编辑dom元素，您可以看到更改，但是，一旦组件中的某些函数被触发，dom就会被更新，您所做的修改就会丢失。