vue 传递 对象 路由_javascript – 如何在Vue中提交表单,重定向到新路由并传递参数？...

< form>的默认行为是重新加载页面onsubmit.在实施SPA时,最好避免调用< form>的默认行为.

利用nuxtjs中现成的路由器模块,可以使所有重定向控件在应用程序中流动.如果我们尝试通过< form>触发可用的事件然后将发生浏览器重新加载.必须避免这种情况.

So my question is how can I submit a form in Nuxt/Vue and redirect to

a new route including the submitted parameters?

您可以尝试以下方法

第一

使用.stop.prevent修饰符可防止提交按钮调用默认的< form>行为.这类似于使用event.stopPropagation();和event.preventDefault();在jQuery中

Submit

然后

创建

> vue模型对象foobar

> vue方法提交

使用此.$router.push重定向到下一页.这将使控制流程保持在SPA内.如果你想将任何数据发送到服务器,那么你可以在调用它之前这样做.$router.push否则你可以重定向并继续你的逻辑.

export default {

data(){

return {

foobar : null

}

},

methods: {

submit(){

//if you want to send any data into server before redirection then you can do it here

this.$router.push("/search?"+this.foobar);

}

}

}