آفلاین
user-avatar

اتصال vue route به کامپونت vue

2 سال پیش
توسط EW آپدیت شد
آفلاین
user-avatar
bardia ( 22746 تجربه )
2 سال پیش
تخصص : Golang/Laravel

دوستان کسی میدونه مشکل کد من چیه
درواقع من یه فایل کامپونت به نام Home.vue در پوشه ly دارم میخوام زمانی که روش کلیلک شد وارد صغحه HOME.VE بشه
اینم کدم

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-۸">
    <meta name="viewport" content="width=device-width, initial-scale=۱.۰">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
    <style>
        .router-link-active {
        color: red;
        }
        .box{
          background-color: blue;
        }
    </style>
</head>
<body>
<div id="app">
<h۱>Hello App!</h۱>
<p>
    <router-link to="/Home">Go to home</router-link>
  </p>
<router-view></router-view>
</div>

<script>
/*import Home from './ly/Home.vue'
const router = new VueRouter({
    routes: [
        { 
        path: '/Home',
        name:Home, 
        component: Home 
        }
    ]
})

const app = new Vue({
  router
}).$mount('#app')

</script>
</body>
</html>
آفلاین
user-avatar
EW ( 13283 تجربه )
2 سال پیش

از این روش استفاده کنید همین درست تره

import Vue from 'vue'
import Router from 'vue-router'
import Hello from '@/components/page1'
import About from '@/components/page2'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'page1',
      component: page1
    },
    {
      path: '/page2',
      name: 'page2',
      component: page2
    }
  ]
})

اینجوری از ارور های ناخواه مثل بالا پیشگیری هم میکنید

برای ارسال پاسخ باید وارد سایت شوید