目前,我的<script>
中有类似以下代码的内容:
render(createElement) {
return createElement("form",
{ref: "formEl" ,
on: {submit: this.handleSubmit}
},
[ <insert create form inputs here> ]);
}
handleSubmit(e) {
e.preventDefault();
//Other stuff that also rely on using e
}
如果我在表单handleSubmit中放置一个提交按钮,则该按钮可以正常运行。但是,如果我要执行this.$refs.formEl.submit()
,则HandleSubmit无法运行。
我已经尝试过将解决方案发布在:VueJs 2 - preventDefault() on $refs.form.submit()
通过添加事件监听方式如下:this.$refs.form.addEventListener("submit", this.handleSubmit);
可悲的是,这没有用。
编辑(在注释后):详细说明“无效”:我发现发生的事情是,当按下<form>
标记HandleSubmit()
中包含的提交按钮时,实际上运行了两次(我假设是两次添加一个侦听器)我添加了一些console.log()
来处理提交,但在控制台上什么也没找到。
该组件是在Typescript中使用类制作的,我可以肯定,它等同于Typescript的组件的方法部分:(在export default class ClassName extends Vue {}
内部)
[我发现,如果我在参考上触发<form>
方法的submit()
标记外部附加了按钮,则将执行使用表单内容更新URL的默认操作。