VueJs local assets path

江枫思渺然 提交于 2020-01-02 16:17:15

问题


I'm working on a Vuejs App. based on Quasar Framework , in src/components/Hello.vue there i have a function to load json file

axios.get('../assets/json/ar/myfile.json')
    .then(response => {
      // JSON responses are automatically parsed.
      console.log(response)
    })
    .catch(e => {
      this.errors.push(e)
    })

it returns error, GET http://localhost:8080/assets/json/ar/ch78.json 404 (Not Found)

so my question is how to get the file from src/assets folder ? axios.get('../assets/json/ar/myfile.json') this line need to be corrected


回答1:


If the data is static (as in this case) you could import it this way:

import myFile from './json/ar/myfile.json'
console.log(myFile.someProp); // will work

As I know Quasar Framework has configured json loader

If data is dynamic (e.g. you don't know the file name at compile time) you should store the server domain somewhere in config and join it with you dynamic path. It may look like this:

import { BASE_URL } from './config'
const lang = getCurrentLang(); // this is dynamic

axios.get(`${BASE_URL}/assets/json/${lang}/myfile.json`)
     .then()
     .catch();

In this case ./config may look like:

export const BASE_URL = 'http://localhost:8080';


来源:https://stackoverflow.com/questions/46445425/vuejs-local-assets-path

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!