bardia
6 سال پیش توسط bardia مطرح شد
1 پاسخ

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

دوستان کسی میدونه مشکل کد من چیه
درواقع من یه فایل کامپونت به نام 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>

ثبت پرسش جدید
EW
@erwin 6 سال پیش آپدیت شد
1

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

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
    }
  ]
})

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


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام