uniapp 支持svg
时间: 2023-07-07 07:42:44 浏览: 227
是的,uni-app 支持 SVG 图片显示。可以在 `<image>` 标签中使用 SVG 图片。需要注意的是,SVG 图片在不同的设备上显示可能会有所不同,因此需要根据实际情况进行调整,并且需要给 SVG 元素设置宽度和高度,否则可能无法显示。
例如,以下代码可以在 uni-app 中显示 SVG 图片:
```html
<template>
<view>
<image mode="aspectFit" :src="svgUrl"></image>
</view>
</template>
<script>
export default {
data() {
return {
svgUrl: "@/assets/icon.svg"
};
}
};
</script>
```
需要注意的是,如果 SVG 文件路径以 `@/` 开头,需要在 `webpack` 配置中添加对 SVG 文件的处理。可以在 `vue.config.js` 文件中添加以下代码:
```javascript
module.exports = {
chainWebpack: (config) => {
const svgRule = config.module.rule("svg");
svgRule.uses.clear();
svgRule
.use("vue-svg-loader")
.loader("vue-svg-loader")
.options({
svgo: {
plugins: [{ removeViewBox: false }]
}
});
}
};
```
这样就可以在 uni-app 中使用 SVG 图片了。希望这些信息对你有所帮助。
阅读全文