Redirecionamento do Vue.js para outra página

Gostaria de fazer um redirecionamento Vue.jssemelhante ao javascript de baunilha

window.location.href = 'some_url'

Como eu consegui isso no Vue.js?

Se você estiver usando vue-router, você deve router.go(path)navegar para qualquer rota específica. O roteador pode ser acessado de dentro de um componente usando this.$router.

Caso contrário, window.location.href = 'some url';funciona bem para aplicativos que não são de uma única página.

EDIT : router.go()alterado no VueJS 2.0. Você pode usar router.push({ name: "yourroutename"})ou router.push("yourroutename")agora mesmo para redirecionar.

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

De acordo com os documentos, router.push parece o método preferido:

Para navegar para um URL diferente, use router.push. Esse método coloca uma nova entrada na pilha do histórico; portanto, quando o usuário clicar no botão Voltar do navegador, ele será levado para o URL anterior.

fonte: https://router.vuejs.org/en/essentials/navigation.html

FYI: Webpack e configuração de componentes, aplicativo de página única (onde você importa o roteador através do Main.js), tive que chamar as funções do roteador dizendo:

this.$router

Exemplo: se você deseja redirecionar para uma rota chamada "Casa" depois que uma condição é atendida:

this.$router.push('Home') 

Apenas use:

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

Não use vue-router, caso contrário você será redirecionado para " http://yoursite.com/#!/http://siwei.me "

meu ambiente: nó 6.2.1, vue 1.0.21, Ubuntu.

Quando dentro de uma tag de script de componente, você pode usar o roteador e fazer algo parecido com isto

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

Apenas um roteamento simples:

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

pode tentar isso também ...

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

se você deseja direcionar para outra página this.$router.push({path: '/pagename'})

se você deseja rotear com parâmetros this.$router.push({path: '/pagename', param: {param1: 'value1', param2: value2})

window.location = url;

'url' é o URL da web que você deseja redirecionar.

Você também pode usar o v-bind diretamente no modelo como ...

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

o :é a abreviatura de v-bind.

Se alguém quiser redirecionamento permanente de uma página /apara outra página/b

Podemos usar a redirect:opção adicionada no router.js. Por exemplo, se queremos redirecionar os usuários sempre para uma página separada quando ele digita o URL raiz ou base /:

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"),

    },
   ]

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

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

Então, o que eu estava procurando era apenas onde colocar window.location.hrefe a conclusão que cheguei foi que a melhor e mais rápida maneira de redirecionar é nas rotas (dessa forma, não esperamos que nada carregue antes de redirecionar).

Como isso:

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

Talvez isso ajude alguém ..

Para acompanhar a sua solicitação original:

window.location.href = 'some_url'

Você pode fazer algo assim:

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

Observe que isso não tira proveito do uso do roteador do Vue, mas se você quiser "fazer um redirecionamento no Vue.js semelhante ao javascript vanilla", isso funcionaria.