Vue.js重定向到其他页面

我想在

Vue.js

中做一个类似于普通javascript的重定向

window.location.href = 'some_url'

---

如何在Vue.js中实现这一点？

如果您使用的是

Vue路由器

，则应使用

router.go（path）

导航到任何特定路线。可以使用

this.$router

从组件内部访问路由器

否则，

window.location.href='some url'适用于非单页应用程序

编辑：
router.go（）
在VueJS 2.0中更改。您可以使用
router.push（{name:“yourroutename”}）
或只使用
router.push（“yourroutename”）
立即重定向


注意：在控制器中使用：
this.$router.push（{name:'routename'}）
只需使用：

window.location.href = "http://siwei.me"

不要使用vue路由器，否则您将被重定向到
“”

我的环境：node 6.2.1、vue 1.0.21、Ubuntu。
根据文档，router.push似乎是首选方法：

要导航到其他URL，请使用router.push。此方法推送
历史堆栈中的新条目，因此当用户单击浏览器时
返回按钮，它们将被带到上一个URL

资料来源：

仅供参考：网页包和组件设置，单页应用程序（通过Main.js导入路由器），我必须通过以下方式调用路由器功能：

this.$router

示例：如果要在满足条件后重定向到名为“Home”的路由：

this.$router.push('Home') 

当在组件脚本标记中时，您可以使用路由器执行以下操作

this.$router.push('/url-path')

我也可以试试这个

router.push({ name: 'myRoute' })

“url”是您要重定向的web url。
只是一个非常简单的路由：

this.$router.push('Home');

您还可以将v-bind直接用于模板，如

<a :href="'/path-to-route/' + IdVariable">



：
是
v-bind

<div id="app">
   <a :href="path" />Link</a>
</div>

<script>
      new Vue({
        el: '#app',
        data: {
          path: 'https://www.google.com/'
        }
      });
</script> enter code here

新Vue({
el:“#应用程序”，
数据：{
路径：'https://www.google.com/'
}
});
在这里输入代码
如果有人想要从一个页面永久重定向到另一个页面
/b


我们可以使用
router.js
中添加的
redirect:
选项。例如，如果我们想在用户键入根url或基本url时将其重定向到一个单独的页面
/
：

const路由器=新路由器({
模式：“历史”，
base:process.env.base\u URL，
路线：[
{
路径：“/”，
重定向：“/someOtherPage”，
姓名：“家”，
组成部分：家庭，
// () =>
//导入（/*webpackChunkName:“home”*/“/views/pageView/home.vue”），
},
]
如果您想转到其他页面，请使用此选项

this.$router.push({path: '/pagename'});

如果要使用参数进行路由，请使用

this.$router.push({
    path: '/pagename', 
    params: {
         param1: 'value1', 
         param2: 'value2'
     }
  });

因此，我所寻找的只是将
window.location.href
放在何处，我得出的结论是，重定向的最佳和最快方式是路由（这样，我们就不会等待任何东西加载后再重定向）

像这样：

routes: [
    {
        path: "/",
        name: "ExampleRoot",
        component: exampleComponent,
        meta: {
            title: "_exampleTitle"
        },
        beforeEnter: () => {
            window.location.href = 'https://www.myurl.io';
        }
    }]

也许这会帮助某人遵守您最初的要求：

window.location.href = 'some_url'

您可以这样做：

<div @click="this.window.location='some_url'">
</div>



请注意，这并没有利用使用Vue的路由器，但如果您希望“在Vue.js中进行类似于普通javascript的重定向”，这将起作用。
这。$router.push可用于重定向Vue.js中的页面

this.$router.push(url);

例如：$router.push（'home'）；
此方法不会刷新页面
从api获取特定页面
最简单的方法是在URL中添加另一个参数，这将破坏缓存

router.replace（data.current+'？t='+（new Date（））.getTime（））

比如说

router.beforeEach((to, from, next) => {

axios
    .get('http://domazin.com/currentpage')
    .then(response => {
     const data = response.data
       if (to.path != data.current) {
              router.replace(data.current + '?t=' + (new Date()).getTime())
       } else {
          next()
       }
    })
    .catch(error => {
        console.log(error)
});

);

在我的例子中，使用的是指向我得到的另一个非单页：
uncaughtreferenceerror:router未定义
error，如何在组件中注入路由器？router.push（“yourroutename”）与router.push不同（{name:“yourroutename”）。第一个直接定义路由。第二个采用指定名称的路由。
this。$router.push（'routename）
@ka_-lin您输入的是错别字，我想您是这个意思。$router.push（'routename'）我看不出任何原因，为什么应该使用双引号。实际上是说“对字符串使用单引号，除非避免转义。”这是很久以前的事了，但实际上我通过使用单引号解决了这个问题，但我想双引号也应该可以工作，并且在复杂的链接中可能有用。首先检查vue版本。在早期版本中，vue可能不关心代码约定。但是在我的环境中，代码约定将导致编译错误（从es6编译到vanilla js）。如果您没有使用“es6”节点模块，可能就可以了。如果您想在新选项卡上打开它，该怎么办？这个问题与编译无关（webpack）。感谢您的否决，尽管大多数人将使用vue cli、Web包、路由器和store/vuex进行开发，并且可能会遇到无法呼叫路由器的问题。@JimmyObonyoAbor hiyo评论na downvote utasema Unalipahaha@Cholowao呵呵，萨瓦·图沙西卡！我有一个反应，卡齐，如果你有技能就揍我…@Jimmyobonyoabort你是指重定向到vue路由器“/my/vuerouter/url”中定义的路由？还是浏览器重定向到？谢谢你，我的英雄，你挽救了这一天！顺便说一下，
param
不起作用，尽管
params
对我有效。你也可以使用ES6语法：：href=“
/path to route/${IdVariable}
”。
router.beforeEach((to, from, next) => {

axios
    .get('http://domazin.com/currentpage')
    .then(response => {
     const data = response.data
       if (to.path != data.current) {
              router.replace(data.current + '?t=' + (new Date()).getTime())
       } else {
          next()
       }
    })
    .catch(error => {
        console.log(error)
});

);