更新记录
1.03(2024-08-14) 下载此版本
修改在非tabbar页面高度问题
1.02(2024-07-01) 下载此版本
新增可设置文字样式
1.01(2024-06-28) 下载此版本
首次提交
查看更多平台兼容性
Vue2 | Vue3 |
---|---|
× | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
× | √ | √ | √ | √ | √ | √ |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
√ | √ | √ | √ |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | √ | √ | √ |
可拖拽多样式浮动菜单
uniapp可拖拽多样式浮动菜单插件,支持在设置限制区域内拖动;支持左右扇形、上下左右直线样式;支持设置图片背和文字+背景色。
使用说明
```<script setup>
import QcSuspendBtn from '@/components/qc-suspendBtn/qc-suspendBtn.vue'
const suspen = reactive({
openType: 'SectorLeft', //LineUp LineDown LineLeft LineRight SectorLeft SectorRight
mainBtn: {
size: 52,
bgImg:
'https://img0.baidu.com/it/u=,&fm=253&fmt=auto&app=138&f=JPEG?w=300&h=300', // 按钮背景图仅支持网络图片 如使用文字 请使用text
initX: 300,
initY: 400,
},
childSize: 44, // 子按钮大小
childBtns: [
{
bgImg: 'https://pp.myapp.com/ma_icon/0/icon_5294_/256', // 按钮背景图仅支持网络图片 如使用文字 请使用text
},
{
bgImg: 'https://pp.myapp.com/ma_icon/0/icon__/256',
},
{
bgImg: 'https://pp.myapp.com/ma_icon/0/icon__/256',
},
],
padding: 15,
})
const childClick = () => {}
</script>
<template>
<QcSuspendBtn
:mainBtn="suspen.mainBtn"
:childSize="suspen.childSize"
:childBtns="suspen.childBtns"
:openType="suspen.openType"
:padding="suspen.padding"
@childClick="childClick"
/>
</template>
```js
交流反馈
如使用过程中有任何问题,或有一些好的建议,欢迎联系