Как я могу использовать svg в Nuxt с Vue. js без их импорта? - PullRequest
Новая
       4

Как я могу использовать svg в Nuxt с Vue. js без их импорта?

0 голосов
/ 22 января 2020

Я работаю с Nuxt и Vue. js и пытаюсь отобразить некоторые svg на странице. Но я продолжаю получать следующее

enter image description here

Не берите в голову розовый, это от другого элемента. Я попытался установить @ nuxtjs / svg и добавил его в свои модули в своем nuxt.config. js, и он говорит, что он должен работать прямо из коробки. Но для меня это не так. Что я делаю не так?

flagPath возвращает /vector/icons/flags/united_kingdom.svg и там они находятся. Он отлично работает с PNG в той же папке. 

<template>
  <div>
      <img :src="flagPath" width="70" height="38" />
  </div>
</template>

<script>
export default {
    props: ['default'],
    data(){
        return{
            folder: '/vector/icons/flags',
            fileName: {'uk' : '/united_kingdom.svg', 'south-korea' : '/south_korea.svg'},
        }
    },
    computed:{
        flagPath: function()
        {
            return this.folder + this.fileName[this.default];
        }
    }
}
</script>

1 Ответ

0 голосов
/ 22 января 2020

Попробуйте, когда он находится в каталоге stati c: 

<img src="/vector/icons/flags/united_kingdom.svg" width="70" height="38" />

Когда вы хотите сослаться на файлы stati c внутри HTML, вы можете просто ссылаться на них с помощью прямого слэ sh.

...