vuejs如何控制form的默认submit行为？

Question

需要能控制表单提交后，让浏览器刷新页面（也就是form默认行为），注意接口返回的不是json而是html，所以只能是控制submit，而不能在按钮click事件里处理，本来我想这么写：

<form :action="targetUrl" method="post" @submit="doSubmit">
    <textarea name="someRequiredData" v-model="someRequiredData"></textarea>
    <button type="submit" style="cursor:pointer;">提交</button>
</form>

<script>
    var app = new Vue(
        data: {someRequiredData}
        methods: {
            doSubmit: function(e){
                e.preventDefault();
                if (!this.someRequiredData) {
                    alert("缺少数据！！！！！");
                    return false;
                } else {
                    //让浏览器自己提交表单，并且刷新页面
                    //我就是卡在了这个位置，如何让浏览器自己提交表单，并且刷新页面？？？
                    return true;
                }
            }
        }
    )
</script>

现实是就算在else分支里return了true也不会让浏览器自己提交表单，并且刷新页面。

于是只能这么写：

<form :action="targetUrl" method="post" onsubmit="return app.doSubmitCheck();">
    <textarea name="someRequiredData" v-model="someRequiredData"></textarea>
    <button type="submit" style="cursor:pointer;">提交</button>
</form>

<script>
    var app = new Vue(
        data: {someRequiredData}
        methods: {
            doSubmitCheck: function(){
                if (!this.someRequiredData) {
                    alert("缺少数据！！！！！");
                    return false;
                } else {
                    return true;
                }
            }
        }
    )
</script>

有没有什么办法避免使用第二种写法？

Answer 1

给form元素添加

@submit.prevent="foo"

具体看文档链接描述

Answer 2

不要用type="submit",用button @click="提交事件",form的onsubmit不要.

你这是传统写法

Answer 3

都用VUE了，还要Form 干什么

Answer 4

在form标签上加上ref="xxxx"，然后在JS里使用this.$refs.xxxx访问，使用this.$refs.xxxx.submit()提交表单。

Answer 5

js 中使用.submit()貌似有点纰漏吧，建议你好好审查啊一下你的参数问题，