Saya ingin melakukan pengalihan Vue.js
serupa dengan javascript vanilla
window.location.href = 'some_url'
Bagaimana saya bisa mencapai ini di Vue.js?
vue.js
url-routing
vuejs2
vue-router
Jimmy Obonyo Abor
sumber
sumber
Jawaban:
Jika Anda menggunakan
vue-router
, Anda harus menggunakanrouter.go(path)
untuk menavigasi ke rute tertentu. Router dapat diakses dari dalam komponen menggunakanthis.$router
.Jika tidak,
window.location.href = 'some url';
berfungsi dengan baik untuk aplikasi non-halaman.EDIT :
router.go()
diubah dalam VueJS 2.0. Anda dapat menggunakanrouter.push({ name: "yourroutename"})
ataurouter.push("yourroutename")
sekarang untuk mengarahkan ulang.https://router.vuejs.org/guide/essentials/named-routes.html
sumber
Uncaught ReferenceError: router is not defined
error, Bagaimana cara menginjeksi router di komponen?this.$router.push('routename)
Menurut dokumen, router.push sepertinya metode yang disukai:
sumber: https://router.vuejs.org/en/essentials/navigation.html
FYI: Webpack & pengaturan komponen, aplikasi satu halaman (tempat Anda mengimpor router melalui Main.js), saya harus memanggil fungsi router dengan mengatakan:
Contoh: jika Anda ingin mengarahkan ulang ke rute yang disebut "Rumah" setelah suatu kondisi terpenuhi:
sumber
cukup gunakan:
Jangan gunakan vue-router, jika tidak Anda akan diarahkan ke " http://yoursite.com/#!/http://siwei.me "
lingkungan saya: simpul 6.2.1, vue 1.0.21, Ubuntu.
sumber
Ketika di dalam tag skrip komponen Anda dapat menggunakan router dan melakukan sesuatu seperti ini
sumber
Hanya perutean sederhana yang mati:
sumber
dapat mencoba ini juga ...
sumber
jika Anda ingin merutekan ke halaman lain
this.$router.push({path: '/pagename'})
jika Anda ingin rute dengan params
this.$router.push({path: '/pagename', param: {param1: 'value1', param2: value2})
sumber
'url' adalah url web yang ingin Anda redirect.
sumber
Anda juga dapat menggunakan v-bind langsung ke template seperti ...
yang
:
merupakan singkatan dariv-bind
.sumber
`/path-to-route/${IdVariable}`
" Atau rute yang disebutkan di sini ( router.vuejs.org/guide/essentials/named-routes.html )::href="{ name: 'NamedRouteDeclaredAtRouter' , params: { id: idValue } }"
Jika ada yang ingin pengalihan permanen dari satu halaman
/a
ke halaman lain/b
Kita dapat menggunakan
redirect:
opsi yang ditambahkan dirouter.js
. Misalnya jika kita ingin mengarahkan pengguna selalu ke halaman terpisah ketika dia mengetik url root atau base/
:sumber
sumber
Jadi, yang saya cari hanyalah tempat untuk meletakkan
window.location.href
dan kesimpulan yang saya dapatkan adalah bahwa cara terbaik dan tercepat untuk mengarahkan ulang adalah melalui rute (dengan cara itu, kami tidak menunggu apa pun untuk dimuat sebelum kami mengarahkan ulang).Seperti ini:
Mungkin itu akan membantu seseorang ..
sumber
Untuk tetap sejalan dengan permintaan awal Anda:
Anda dapat melakukan sesuatu seperti ini:
Perhatikan bahwa ini tidak memanfaatkan penggunaan router Vue, tetapi jika Anda ingin "membuat pengalihan di Vue.js mirip dengan vanilla javascript", ini akan berhasil.
sumber