Facebook
18
Tháng 11Cách điều hướng URL ngoài trong Vue
Trong hướng dẫn này, chúng ta sẽ tìm hiểu về cách điều hướng một URL bên ngoài trong Vue Route.
Thông thường, chúng ta điều hướng người dùng tới trang khác trên cùng site bằng cách sử dụng phương thức sau:
this.$route.push('/about');
Điều hướng tới URL bên ngoài
Giả sử chúng ta có route /contact trong ứng dụng vue. Khi người dùng ghé thăm trang /contact, chúng ta cần điều hướng họ tới một url ngoài là https://www.google.com/contact thay
vì điều hướng cùng tên miền.
Để điều hướng người dùng tới một URL ngoài, chúng ta có thể sử dụng thuộc tính window.location.href .
Đây là ví dụ:
contact.js
<template>
<div> <h1>Contact Page</h1> </div> </template>
<script>
export default {
created() { window.location.href = "https://google.com/contact"; }, };
</script>
Trong code trên, chúng ta đã thêm window.location.href = "https://google.com/contact" .
Tương tự, chúng ta cũng có thể thiết lập điều hướng một url ngoài trong đối tượng route bằng cách sử dụng route guard beforeEnter.
{
path: "/contact",
component: Contact,
beforeEnter(to, from, next) {
window.location.href = "https://google.com/contact";
Đánh giá