更新记录

1.0.2（2023-08-18）

优化处理BUG

1.0.1（2023-08-18）

优化

1.0.0（2023-08-18）

插件发布

查看更多

平台兼容性

Vue2 Vue3
√ ×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
app-vue app-nvue × √ × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
√ √ √ √ √ × √ √ √

csr-button

属性Props

参数名 类型 默认值 说明 可选值
type String 'filled' 按钮的外观类型 filled：纯色plain：简约hollow：镂空none：镂空无边框
width String 90%屏宽 按钮宽度（除小程序外支持百分比，单位随意） -
height String '80rpx' 按钮高度（除小程序外支持百分比，单位随意） -
color HexColor '#007AFF' 按钮颜色 -
font-size String, Number 38.8%按钮高度 按钮文字的字体大小（单位：rpx） -
radius Array ['7px'] 按钮的四角弧度
border-size String, Number 1 按钮边框的宽度（单位：px） -
border-type String 'solid' 按钮边框的类型 solid：实线dashed：虚线dotted：点阵
ripple Boolean false 是否开启水波纹（水波纹与hover-class不同时存在） true
ripple-bg-color HexColor, RgbColor 'rgba(0,0,0,0.15)' 水波纹的颜色 -
is-show-loading Boolean false 是否显示加载动画（启用后如果不显示加载动画，请加大宽度，直到显示） true
disabled Boolean false 是否禁用按钮 true
icon-path Sting - 图标地址，为空时不显示图标，支持网络地址（启用后如果不显示图标，请加大宽度，直到显示） -
icon-size String, Number 38.8%按钮高度 图标大小（单位：rpx） -
icon-margin-right String, Number 15 图标距离按钮文字的距离（单位：rpx） -
count-down Boolean false 是否开启倒计时 true
count-down-num Number 60 倒计时的时间（单位：s） -
count-down-text String '后重新获取' 显示在倒计时后面的文字 -
box-shadow String - 按钮阴影，格式同css -
form-type String - 用于 <form> 组件，点击分别会触发 <form> 组件的 submit/reset 事件 submit：提交表单reset：重置表单
data-param String - 用于data-xxx属性，通过currentTarget.dataset.param获取 -
open-type String - 平台开放能力，具体请看uniapp文档关于button组件部分说明

以下为微信小程序开放能力参数（只对微信小程序生效）

参数名 类型 默认值 说明
lang String 'en' 指定返回用户信息的语言，zh_CN 简体中文，zh_TW 繁体中文，en 英文。
session-from String - 会话来源，open-type="contact"时有效
send-message-title String 当前标题 会话内消息卡片标题，open-type="contact"时有效
send-message-path String 当前分享路径 会话内消息卡片点击跳转小程序路径，open-type="contact"时有效
send-message-img String 截图 会话内消息卡片图片，open-type="contact"时有效
show-message-card boolean false 是否显示会话内消息卡片，设置此参数为 true，用户进入客服会话会在右下角显示"可能要发送的小程序"提示，用户点击后可以快速发送小程序消息，open-type="contact"时有效

事件Event

事件名 说明 生效时机
@click 点击事件 -
@longclick 长按事件 -
@getphonenumber 获取用户手机号回调 open-type="getPhoneNumber"
@getuserinfo 用户点击该按钮时，会返回获取到的用户信息，从返回参数的detail中获取到的值同uni.getUserInfo open-type="getUserInfo"
@error 当使用开放能力时，发生错误的回调 open-type="launchApp"
@opensetting 在打开授权设置页并关闭后回调 open-type="openSetting"
@launchapp 打开 APP 成功的回调 open-type="launchApp"

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

插件不采集任何数据

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

许可协议

MIT协议
评论列表 撰写评论
加载更多...
插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...