Skip to content Skip to sidebar Skip to footer

Vue Router - Build From JSON

I'm quite new to Vue.js. I'm used to vanilla JavaScript. I need to be able to generate route paths from a JSON file. How can I achieve it? EDIT For example, say this is my JSON: [

Solution 1:

Assuming your component's name is name in the object, we need to match your structure to Vue Router API. Thus, we can do as follows:

const myRoutes = [
  {
    "name": "Product 1",
    "url": "product-1",
  },
  {
    "name": "Product 2",
    "url": "product-2",
  }
]

const router = new VueRouter({
  routes: myRouters
          .map(({name, url})=>({component: name, path: `/${url}`)),
})

Post a Comment for "Vue Router - Build From JSON"