Tutorial Vue 3 dan Laravel 10 #3 : Install dan Konfigurasi Router di Vue 3
Selamat datang kembali di tutorial kami tentang Vue 3 dan Laravel 10! Pada bagian ini, kita akan membahas tentang cara untuk menginstall dan mengkonfigurasi router di Vue 3.
Langkah 1: Install Vue Router
Langkah pertama yang perlu dilakukan adalah menginstall Vue Router. Anda dapat melakukannya dengan menggunakan npm (Node Package Manager) dengan mengetikkan perintah berikut di terminal:
npm install vue-router
Langkah 2: Konfigurasi Router
Setelah menginstall Vue Router, langkah selanjutnya adalah mengkonfigurasi router di aplikasi Vue 3 Anda. Anda perlu membuat file baru untuk konfigurasi router, misalnya router.js dan menambahkan kode berikut:
import { createWebHistory, createRouter } from "vue-router";
import Home from "./components/Home.vue";
import About from "./components/About.vue";
const routes = [
{
path: "/",
name: "Home",
component: Home,
},
{
path: "/about",
name: "About",
component: About,
},
];
const router = createRouter({
history: createWebHistory(),
routes,
});
export default router;
Langkah 3: Menggunakan Router di Aplikasi Vue
Setelah konfigurasi router selesai, Anda dapat menggunakan router tersebut di aplikasi Vue Anda. Misalnya, Anda dapat menggunakannya di file main.js sebagai berikut:
import { createApp } from 'vue';
import App from './App.vue';
import router from './router';
const app = createApp(App);
app.use(router);
app.mount('#app');
Dengan langkah-langkah di atas, Anda telah berhasil menginstall dan mengkonfigurasi router di Vue 3. Selanjutnya, Anda dapat mulai menggunakan router untuk membuat navigasi antar halaman di aplikasi Anda.
Itulah tutorial singkat kali ini tentang cara menginstall dan mengkonfigurasi router di Vue 3. Semoga bermanfaat!
bang mau tanya,, itu kan axios,, itu databsae nya kesimpen dimana ya ?