Vue router + map, i get a problem when use children with them

index.js

import Vue from 'vue'
import Router from 'vue-router'

// Routes
import paths from './paths'

function route (path, view, name, children) {
  return {
    name: name || view,
    path,
    component: (resovle) => import(
      `@/views/${view}.vue`
    ).then(resovle),
    children
  }
}


Vue.use(Router)

// Create a new router
const router = new Router({
  mode: 'history',
  routes: paths.map(path => route(path.path, path.view, path.name, path.children)).concat([
    { path: '*', redirect: '/'}
  ]),
  scrollBehavior (to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    }
    if (to.hash) {
      return { selector: to.hash }
    }
    return { x: 0, y: 0 }
  }
})

export default router

اتوقع ان سبب المشكلة هي لان children عبارة عن array وتحتاج لضبط اخر لها.

1 Like

ممكن تستخدم الـjs spread operator ... بهذا الشكل:

function route (path, view, name, children) {
  return {
     //....
    ).then(resovle),
    ...children
  }
}

1 Like

جربتها بالفعل بهذي الطريقة, لكن لم تعمل معي ايضا

بالنسبة للـpath انا عملتها بهذي الطريقة

export default [
  {
    path: '/dashboard',
    view: 'Dashboard',
    children: [
      {
        path: 'add_product',
        view: 'AddProduct',
        name: 'addProduct'
      },
      {
        path: 'information',
        view: 'Information',
        name: 'information'
      }
    ]
  },
]
1 Like

نعم لا بد من تحديد component
يمكنك استبدال view ب component

تأكد من عمل import للcomponents

1 Like

حبيبي @sniperadmin ماقصرت. :rose:

هل في طريقة اعملها بنفس الاب (view) ؟

1 Like

يمكنك تفقد آخر تحديث للـdocumentation الخاص بـview-router
من هنا: https://router.vuejs.org/guide/essentials/named-views.html

لا مشكلة… نحن هنا للمساعدة :ok_hand: :wink:

1 Like