Перенаправление Vue.js на другую страницу

Ответ 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

Ответ 2

Согласно документам, router.push выглядит как предпочтительный метод:

Чтобы перейти к другому URL-адресу, используйте router.push. Этот метод подталкивает новый вход в стек истории, поэтому, когда пользователь нажимает на браузер назад, они будут перенесены в предыдущий URL.

источник: https://router.vuejs.org/en/essentials/navigation.html

FYI: настройка Webpack и компонентов, одностраничное приложение (где вы импортируете маршрутизатор через Main.js), мне пришлось вызвать функции маршрутизатора, сказав:

this.$router

Пример: если вы хотите перенаправить маршрут, называемый "Главная", после выполнения условия:

this.$router.push('Home') 

Ответ 3

просто используйте:

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

Не используйте vue-router, иначе вы будете перенаправлены на " http://yoursite.com/#!/http://siwei.me "

моя среда: узел 6.2.1, версия 1.0.21, Ubuntu.

Ответ 4

Внутри тега скрипта компонента вы можете использовать роутер и сделать что-то вроде этого

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

Ответ 5

Просто мертвая простая маршрутизация:

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

Ответ 6

могу попробовать это тоже...

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

Ответ 7

window.location = url;

'url' - это веб-URL, который вы хотите перенаправить.

Ответ 8

Вы также можете использовать V-Bind непосредственно к шаблону, как...

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

: это аббревиатура v-bind.

Ответ 9

Допустим, мы обновляем статус заказов, нажимаем на изменение и обновляем статус, теперь мы хотим вернуться на предыдущую страницу, с которой мы пришли.

this.$router.push('../index')

здесь часть ../index означает, что вы дважды вернетесь с текущего маршрута, а затем index - это имя представления, к ../index вы хотите перейти.

в общем, this.$router.push('your_path')

Ответ 10

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

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

Ответ 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"),

    },
   ]

Ответ 12

если вы хотите направить на другую страницу this.$router.push({path: '/pagename'})

если вы хотите, чтобы маршрут с параметрами this.$router.push({path: '/pagename', param: {param1: 'value1', param2: value2})

Ответ 13

Навигация между routes Vue Routes

Предпочтительным методом является router.push(location, onComplete?, onAbort?)

Так как:

Чтобы перейти к другому URL-адресу, используйте router.push. Этот метод помещает новую запись в стек истории, поэтому, когда пользователь нажимает кнопку "Назад" в браузере, он перенаправляется на предыдущий URL-адрес.

Прочитайте документацию ЗДЕСЬ.

Перейдите на внешний URL

Вы не используете маршрутизатор Vue для внешней маршрутизации, он обрабатывает только маршрутизацию в вашем приложении. Используйте Vanilla JS для этого.

window.location = 'http://www.example.com';

или же

location.replace('http://example.com');

или же

window.open('http://example.com');

Ответ 14

Вы также можете работать с parent.location.href= 'url'