How to import and use data json on router.js?

vue-cli

#1

I want the path and name of the router to be taken from json, but I don’t know how to import json into router.js.
thank all.


#2

I don’t know, why you would want to do this.

But you probably would put your json into the static or public folder & then import it in router.js


#3

YOu can do it very easily. When you will import any file, webpack uses an appropriate loader (specified in your webpack.config.js ) to build the file. In case it is a .vue file, it uses vue-loader to build the file and return a Vue component. You also need an Array containing your data, not a vue component. You can import simple .js and .json files for this. Here is an example:

data.js

const data = [{ log1d: 1, logDetail: 'This is some log detail for log 1', logType: 'general', createdBy: 'name', CreatedAt: 'date' },
            { log1d: 2, logDetail: 'This is some log detail for log 2', logType: 'general', createdBy: 'name2', CreatedAt: 'date2' },
            { log1d: 3, logDetail: 'This is some log detail for log 3', logType: 'general', createdBy: 'name3', CreatedAt: 'date3' },
            { log1d: 4, logDetail: 'This is some log detail for log 4', logType: 'general', createdBy: 'name4', CreatedAt: 'date4' }
            ]
export default data;

component.vue

import logs from 'data.js'
export default {
    data () {
        return {
        logitems: logs
        }
    }
}

#4

thank @shameem, i’m know this, and i can use in component.vue. I don’t know how to use json data in router.js. I want to use data json in router.js? can you help me?


#5

I want the value of name and path get from file json data.


#6

I did the following, but it failed:
My router file.
Capture

My json file.
Capture1


#7

How does it fail?
What is the error?