美文网首页
Vue自动提交form表单后,自动跳转第三方页面

Vue自动提交form表单后,自动跳转第三方页面

作者: YQSummer | 来源:发表于2020-04-22 17:56 被阅读0次

    在vue开发中需要接入第三方页面,有时返回的是地址,我们可以直接进行页面跳转;有时返回的是form表单的形式,需要进行表单自动提交,跳转到相对应的页面;

    我们就有必要了解下js提供的document.forms方法了

    (1)document.forms:表示获取当前页面的所有表单
    
    (2)document.forms[0]:表示获取当前页面的第一个表单
    
    (3)document.forms['exportServlet']:表示获取当前页面的name="exportServlet"的表单
    
    (4)submit()表示提交函数
    

    话不多说,直接上代码

    首先要把表单的内容放在一个页面中

      <div v-html="formData"></div>
    
    

    通过document.forms[0].submit() 获取当前页面第一个表单提交

      mounted(){     
                this.formData = sessionStorage.getItem('parking'); //这里是获取表单的内容
                this.$nextTick(() => {
                    document.forms[0].submit(); //这里就是获取第一个表单并提交
                })
            },
    

    这样就可以跳转到相对应的第三方页面啦。是不是很开心。

    相关文章

      网友评论

          本文标题:Vue自动提交form表单后,自动跳转第三方页面

          本文链接:https://www.haomeiwen.com/subject/kbjwihtx.html