vuejs 动态提交form表单问题

Question

通过v-for动态循环某个对象，添加隐藏的元素到form中，然后通过 document.getElementById('form').submit()来提交，此时发现另一个页面接收不到参数。
而通过document.createElement('input')方式创建的元素就可以接收到参数。

最奇怪的是，无论是v-for还是document.createElement()方式都能通过console.log(form)看到里面的内容。仅仅是一个能接收到参数一个接收不到。
难道v-for创建的表单不能通过document.getElementById('form').submit()方式来提交？

v-for 方式

<form method="post" id="cgForm" style="display: none;" :action="formData != null ? formData.url : ''">
     <input type="hidden" v-for="(v, k) in formData" v-if="k != 'url'" :value="v" :name="k"/>
</form>
        
<script type="text/babel">
    this.formData = data.data;
    let form = document.getElementById('cgForm');
    console.log(form); // form中的元素都在, 可就是接收不到form中任何东西, 且提交时action也是 '/' 并不是设置好的url
    form.submit();
</script>

普通form表单

<form method="post" id="cgForm" style="display: none;"></form>

<script type="text/babel">
    this.formData = data.data;
    let form = document.getElementById('cgForm');
    
    for(let p in this.formData){
        if(p != 'url'){
            let input = document.createElement('input');
            input.setAttribute('name', p);
            input.setAttribute('value', this.formData[p]);
            form.append(input);
        }
    }
    form.action = data.data.url;
    form.submit();
</script>

Answer 1

vuejs有生命周期，你js运行的时候，dom还没完全生成，你可以在vue生命周期mounted中提交下表单试试，附上链接https://cn.vuejs.org/v2/api/#...