更新记录

2.2（2024-04-22）

细节，添加left:0；居左

2.1（2024-04-11）

新增透明色背景

2.0（2024-04-09）

细节修正，保证1个按钮的时候，样式百分比不会错乱。

平台兼容性

插件使用方式：

template代码

nums参数为2，代表2个按钮，slot依次为button-1,button-2
nums参数为1，代表1个按钮，slot为button-1
background="transparent" 代表背景色透明，默认白色

<bottom-button :nums="2" background="transparent">
    <template slot="button-1">
        <button class="clear-btn" @click="clear">清除</button>
    </template>
    <template slot="button-2">
        <button class="save-btn" @click="save">保存</button>
    </template>
</bottom-button>

Javascript代码

import bottomButton from "@/components/bottom-button"

自定义style代码

.clear-btn {
            font-size: 28rpx;
            font-weight: 500;
            color: rgb(13, 110, 253);
            width: 280rpx;
            height: 66rpx;
            border-radius: 35rpx;
            padding: 0;
            box-shadow: 0px 2rpx 5rpx 0px rgba(102, 103, 104, 0.46);
            border:1px solid rgb(13, 110, 253);
            background:#fff;
        }
.save-btn {
            font-size: 28rpx;
            font-weight: 500;
            color: rgba(#fff, 0.9);
            width: 280rpx;
            height: 70rpx;
            border-radius: 35rpx;
            padding: 0;
            box-shadow: 0px 2rpx 5rpx 0px rgba(102, 103, 104, 0.46);
            background: rgb(13, 110, 253);
        }