Question

我想在<head> <meta http-equiv="refresh" content="3600"> </head>中进行重定向，类似于vanilla javascript

Vue.js

我怎样才能在Vue.js中实现这个目标？

Answer 1

如果您使用vue-router，则应使用router.go(path)导航到任何特定路线。可以使用this.$router从组件内访问路由器。

否则，window.location.href = 'some url';适用于非单页应用。

编辑：router.go()在VueJS 2.0中发生了变化。您现在可以使用router.push({ name: "yourroutename"})或router.push("yourroutename")来重定向。

https://router.vuejs.org/guide/essentials/named-routes.html

Answer 2

根据文档，router.push似乎是首选方法：

要导航到其他网址，请使用router.push。这种方法推动了新进入历史堆栈，所以当用户点击浏览器时后退按钮，它们将被带到上一个URL。

来源：https://router.vuejs.org/en/essentials/navigation.html

仅供参考：Webpack＆amp;组件设置，单页面应用程序（通过Main.js导入路由器），我不得不通过说：

来调用路由器功能

this.$router

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

this.$router.push('Home')

Answer 3

只需使用：

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

请勿使用vue-router，否则您将被重定向到 “http://yoursite.com/#!/http://siwei.me”

我的环境：节点6.2.1，vue 1.0.21，Ubuntu。

Answer 4

当在组件脚本标记内部时，您可以使用路由器并执行类似这样的操作

then()

Answer 5

也可以尝试...

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

Answer 6

简单的简单路由：

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

Answer 7

window.location = url;

“ URL”是您要重定向的网络URL。

Answer 8

this.$router.push 可用于在 vue.js 中重定向页面

this.$router.push(url);

例如 this.$router.push('home'); 此方法不会刷新页面

Answer 9

您也可以将v-bind直接用于模板，例如...

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

:是v-bind的缩写。

Answer 10

因此，我一直在寻找window.location.href所在的位置，而我得出的结论是，重定向的最佳和最快方法是在路由中（这样，我们在重定向之前不会等待任何内容加载。

赞：

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

也许会帮助某人。

Answer 11

如果有人希望从页面/a永久重定向到另一页面/b

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

const router = new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      path: "/",
      redirect: "/someOtherPage",
      name: "home",
      component: Home,
      // () =>
      // import(/* webpackChunkName: "home" */ "./views/pageView/home.vue"),

    },
   ]

Answer 12

如果要路由到另一个页面 this.$router.push({path: '/pagename'})

如果要使用参数进行路由 this.$router.push({path: '/pagename', param: {param1: 'value1', param2: value2})

Answer 13

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

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

Answer 14

要与您的原始请求保持一致：

window.location.href = 'some_url'

您可以执行以下操作：

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

请注意，这没有利用Vue的路由器，但是如果您想“在Vue.js中进行类似于香草javascript的重定向”，则可以使用。

Answer 15

您也可以使用parent.location.href = 'url'

Answer 16

从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)
});

);

Answer 17

Vue3.js 重定向

Vue3 js 全局重定向可以在 main.ts 中使用此方法定义

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'

const app = createApp(App)
app.config.globalProperties.$redirect = (page) => {router.push(page)}
app.use(router).mount('#app')

组件

<button @click="$redirect('/login')" type="button" class="btn ">Login</button>

Vue.js重定向到另一个页面

17 个答案: