Home > Software engineering >  How to use an external array in Vue JS
How to use an external array in Vue JS

Time:12-22

I've been trying to use an external array in my VueJs code, but I've been running into problems

Here's my code:

import iconsData from 'components/iconsData.js';
  export default{
    data(){
      return{
        activeIcon: '',
        icons : iconsData
      }
    },
    methods: {
      consoleIcons(){
        console.log(this.icons)
      }
    }
  }

iconsData.js is:


export const iconsData = [
   {"name": "material-icons"},
   {"name": "eva-icons"},
]

but all I get is a warning:


export 'default' (imported as 'iconsData') was not found in 'components/iconsData.js' (possible exports: iconsData)

any help is appreciated.

CodePudding user response:

The error is tied to the import. Currently, iconsData.js exports an object { iconsData: [...] }. Thus, you need to be more specific about what exactly you are trying to import:

import { iconsData } from 'components/iconsData.js';

Alternatively, this would also work:

export default [
   {"name": "material-icons"},
   {"name": "eva-icons"},
]
  • Related