鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ 跪求vue中使用use標(biāo)簽引入svg的正確方法？svg-sprite-loade

跪求vue中使用use標(biāo)簽引入svg的正確方法？svg-sprite-loader這個東西的作用是什么？

我希望在項目中可以這樣引入svg：

 <svg>
    <use :xlink:href="require('./xxx/xxx/xxx.svg')"></use>
 </svg>

但是這么做就會報一個地址的錯誤，然后我裝了svg-sprite-loader，在webpack.base.conf.js中添加了

 {
    test: /\.svg$/,
    use: {
      loader: 'svg-sprite-loader',
      query: {
        name: '[name]_[hash:6]',
        prefixize: true
      }
    }
  },

但是發(fā)現(xiàn)依舊不行 （webpack的配置是vue-cli生成的）， 所以跪求大神叫我一下我應(yīng)該這么做。我也很絕望。

回答
編輯回答
法克魷

clipboard.png
打印出來是這個

2017年10月7日 04:58
編輯回答
陪妳哭

先在js中引用，并加在data中

var svgUrl= require('./xxx/xxx/xxx.svg')
{
    data() {
        return {
            svgUrl
        }
    }
}

然后在模板中使用

 <svg>
    <use :xlink:href="svgUrl"></use>
 </svg>
2018年1月16日 06:52