更新记录
1.0.0(2024-12-25)
下载此版本
- 调整为uni_modules目录规范
- 小程序支持渲染svg格式图片
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
× |
× |
× |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
鸿蒙元服务 |
× |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
× |
× |
× |
× |
× |
× |
× |
× |
× |
king-svg-render svg格式图片渲染组件
uniapp 更多小程序渲染有颜色图片的方案
查看更多
平台兼容
H5 |
微信小程序 |
支付宝小程序 |
百度小程序 |
头条小程序 |
QQ 小程序 |
App |
x |
√ |
未测 |
未测 |
未测 |
未测 |
未测 |
代码演示
插件demo
import {
ref
} from 'vue';
const svgColor = ref('#eb3941')
const imgSrc = ref('/static/images/order.svg')
<style scoped>
.svg-render-test {
width: 120rpx;
height: 120rpx;
}
.svg-render-title {
display: flex;
width: 400rpx;
}
.render-title {
display: inline-block;
flex: 0 0 100rpx;
}
input {
border: 1px solid #aaa;
}
</style>
## API
### Props
| 参数 | 说明 | 类型 | 默认值 |
| -------------------------- | ------------------------------------------------------------ | ---------------- | ------------|
| imgSrc | 图片地址 | <em>string</em> | - |
| isLocalUrl | 是否本地资源图片 | <em>boolean</em> | true |
| svgColors | 图片颜色 | <em>Array</em> | - |