更新记录
1.0.2(2024-08-26) 下载此版本
修改文档,增加演示示例
1.0.1(2024-08-21) 下载此版本
修正文档
1.0.0(2024-08-21) 下载此版本
初始化
查看更多平台兼容性
uni-app
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| - | √ | √ | √ | - | - | - | - | - |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|
| √ | - | - | - | - | - | - | - | - | - | - |
其他
| 多语言 | 暗黑模式 | 宽屏模式 |
|---|---|---|
| × | × | √ |
hope-11-shape-divider
示例
引入
import ShapeDivider from '@/uni_modules/hope-11-shape-divider/components/hope-11-shape-divider/hope-11-shape-divider.vue'
使用
<ShapeDivider>
<image :src="image4" mode="aspectFill" class="image"></image>
</ShapeDivider>
属性
| 参数 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| shape | String | waves | 形状,可选值:waves, waves-opacity, curve, curve-asymmetrical, triangle, triangle-asymmetrical, tilt, arrow, split, book |
| color | String | #ffffff | 颜色 |
| width | Number, String | 100 | 宽度,单位为 % |
| height | Number, String | 100 | 高度,单位为 rpx |
| flip | String | false | 翻转,即水平翻转,支持形状:waves, waves-opacity, curve-asymmetrical, triangle-asymmetrical, tilt |
| invert | Boolean | false | 倒转,即垂直翻转,支持形状:waves, curve, curve-asymmetrical, triangle, triangle-asymmetrical, arrow, split, book |
| position | Boolean | top | 位置,可选值:top, bottom |
说明
该组件还未进行多平台详尽测试,可自行尝试使用,如有问题请在评论区指出或联系作者,多谢支持!

收藏人数:
https://github.com/hope-11/shape-divider.git
下载插件并导入HBuilderX
下载示例项目ZIP
赞赏(0)
下载 940
赞赏 5
下载 11023903
赞赏 1800
赞赏
京公网安备:11010802035340号