text: (window.webpackJsonp=window.webpackJsonp||[]).push([[132],{560:function(t,e,a){"use strict";a.r(e);var l=a(25),v=Object(l.a)({},(function(){var t=this,e=t.$createElement,a=t._self._c||e;return a("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[a("h1",{attrs:{id:"按钮-button"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮-button"}},[t._v("#")]),t._v(" "),a("H2Icon"),t._v(" 按钮 Button")],1),t._v(" "),a("blockquote",[a("p",[t._v("常用的操作按钮。")])]),t._v(" "),a("h2",{attrs:{id:"按钮类型"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮类型"}},[t._v("#")]),t._v(" 按钮类型")]),t._v(" "),a("p",[t._v("通过设置"),a("code",[t._v("type")]),t._v("属性为"),a("code",[t._v("default")]),t._v("、"),a("code",[t._v("success")]),t._v("、"),a("code",[t._v("error")]),t._v("、"),a("code",[t._v("warning")]),t._v("来创建不同样式的Button，样式默认为"),a("code",[t._v("default")]),t._v("。")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/1.png",alt:"height=100"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button type="default">default</l-button>\n<l-button type="error">error</l-button>\n<l-button type="success">success</l-button>\n<l-button type="warning">warning</l-button>\n')])])]),a("h2",{attrs:{id:"按钮尺寸"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮尺寸"}},[t._v("#")]),t._v(" 按钮尺寸")]),t._v(" "),a("p",[t._v("通过"),a("code",[t._v("size")]),t._v("属性更改按钮大小为"),a("code",[t._v("mini")]),t._v("（小）、"),a("code",[t._v("medium")]),t._v("（中）、"),a("code",[t._v("large")]),t._v("（大）和"),a("code",[t._v("long")]),t._v("(通栏按钮)。默认大小为"),a("code",[t._v("medium")]),t._v("(中)。")]),t._v(" "),a("div",{staticClass:"custom-block tip"},[a("p",{staticClass:"custom-block-title"},[t._v("TIP")]),t._v(" "),a("p",[t._v("对应尺寸的按钮长和宽款式固定的，仅当按钮文案超出按钮长度时按钮长度会适应性改变长度。\n如需更改长和宽，请使用"),a("code",[t._v("height")]),t._v("和"),a("code",[t._v("width")]),t._v("属性进行更改。")])]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/2.png",alt:"height=200"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码-2"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-2"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button size="medium">中按钮</l-button>\n<l-button size="large">大按钮</l-button>\n<l-button size="mini">小按钮</l-button>\n<l-button size="long">通栏按钮</l-button>\n')])])]),a("h2",{attrs:{id:"设置按钮长和宽"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#设置按钮长和宽"}},[t._v("#")]),t._v(" 设置按钮长和宽")]),t._v(" "),a("p",[t._v("通过"),a("code",[t._v("height")]),t._v("和"),a("code",[t._v("width")]),t._v("属性设置按钮的长和宽。单位为rpx。")]),t._v(" "),a("h3",{attrs:{id:"示例代码-3"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-3"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button width="500" height="120">按钮</l-button>\n')])])]),a("h2",{attrs:{id:"按钮形状"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮形状"}},[t._v("#")]),t._v(" 按钮形状")]),t._v(" "),a("p",[t._v("通过"),a("code",[t._v("shape")]),t._v("属性更改按钮形状为"),a("code",[t._v("square")]),t._v("（直角）、"),a("code",[t._v("circle")]),t._v("（圆弧）或"),a("code",[t._v("semicircle")]),t._v("（半圆）。默认形状为"),a("code",[t._v("circle")]),t._v("(圆弧形)。")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/3.png",alt:"height=100"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码-4"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-4"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button shape="semicircle">半圆角</l-button>\n<l-button shape="circle">圆弧角</l-button>\n<l-button shape="square">方角</l-button>\n')])])]),a("h2",{attrs:{id:"镂空按钮"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#镂空按钮"}},[t._v("#")]),t._v(" 镂空按钮")]),t._v(" "),a("p",[t._v("通过"),a("code",[t._v("plain")]),t._v("属性为"),a("code",[t._v("true")]),t._v("设置按钮为镂空按钮，默认值为"),a("code",[t._v("false")]),t._v("。")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/4.png",alt:"height=200"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码-5"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-5"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button plain="{{true}}">镂空</l-button>\n')])])]),a("h2",{attrs:{id:"禁用按钮"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#禁用按钮"}},[t._v("#")]),t._v(" 禁用按钮")]),t._v(" "),a("p",[t._v("通过"),a("code",[t._v("disabled")]),t._v("属性设置按钮的禁用状态。")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"https://cdn.talelin.com/WX20201214-204446@2x.png",alt:"width=500"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码-6"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-6"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button disabled="{{true}}">禁用按钮</l-button>\n')])])]),a("h2",{attrs:{id:"加载状态"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#加载状态"}},[t._v("#")]),t._v(" 加载状态")]),t._v(" "),a("p",[t._v("通过设置"),a("code",[t._v("loading")]),t._v("属性在按钮上显示加载状态。")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/6.png",alt:"height=100"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码-7"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-7"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button loading="{{true}}">加载中</l-button>\n')])])]),a("h2",{attrs:{id:"图标按钮"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#图标按钮"}},[t._v("#")]),t._v(" 图标按钮")]),t._v(" "),a("p",[t._v("在按钮文字前面添加图标，设置Button的"),a("code",[t._v("icon")]),t._v("属性可使用icon组件的图标。")]),t._v(" "),a("p",[t._v("设置"),a("code",[t._v("icon-size")]),t._v("和"),a("code",[t._v("icon-color")]),t._v("属性可更改图标大小和图标颜色。")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/7.png",alt:"height=100"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码-8"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-8"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button icon="warning" icon-size="20" icon-color="#fff">icon图标</l-button>\n')])])]),a("h2",{attrs:{id:"特殊样式按钮"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#特殊样式按钮"}},[t._v("#")]),t._v(" 特殊样式按钮")]),t._v(" "),a("blockquote",[a("p",[t._v("同时设置spcial属性和open-type时，仅在slot中定义的内容可以触发开放能力。")])]),t._v(" "),a("p",[t._v("在某些场景下，对Button的样式会有一些特殊需求，比如使用按钮开放能力的图片。此时可设置Button的"),a("code",[t._v("special")]),t._v("属性使按钮成为一个自定义按钮。")]),t._v(" "),a("p",[t._v("自定义内容在组件slot插入即可。")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/8.png",alt:"height=200"}}),t._v("\n:::")]),t._v(" "),a("h3",{attrs:{id:"示例代码-9"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-9"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button special="{{true}}" open-type="share">\n    \x3c!-- 此处是插槽自定义内容 --\x3e\n   <l-icon name="share" />\n</l-button>\n')])])]),a("h2",{attrs:{id:"按钮微信开放能力"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮微信开放能力"}},[t._v("#")]),t._v(" 按钮微信开放能力")]),t._v(" "),a("blockquote",[a("p",[t._v("建议使用开放能力前仔细阅读"),a("a",{attrs:{href:"https://developers.weixin.qq.com/miniprogram/dev/component/button.html",target:"_blank",rel:"noopener noreferrer"}},[t._v("微信小程序button组件"),a("OutboundLink")],1),t._v("的相关文档，充分了解小程序Button的相关开放能力。")])]),t._v(" "),a("p",[t._v("Lin-Mini的Button组件同样支持小程序原生Button的相关开放能力。")]),t._v(" "),a("p",[t._v("例如，小程序可以通过原生Button来获取用户的相关信息。而使用Lin-Mini的Button组件同样可以做到，且用法同原生Button保持一致。")]),t._v(" "),a("p",[t._v("具体使用方法如下：")]),t._v(" "),a("ul",[a("li",[t._v("根据需求设置Button的"),a("code",[t._v("open-type")]),t._v("(开放能力类型)属性，该属性的可选值与"),a("a",{attrs:{href:"https://developers.weixin.qq.com/miniprogram/dev/component/button.html",target:"_blank",rel:"noopener noreferrer"}},[t._v("小程序Button组件"),a("OutboundLink")],1),t._v("的"),a("code",[t._v("open-type")]),t._v("属性可选值保持一致。")])]),t._v(" "),a("p",[t._v("例如设置分享功能即可写为"),a("code",[t._v('open-type="share"')]),t._v("。")]),t._v(" "),a("ul",[a("li",[t._v("某些开放能力同时还需要传入一个回调函数用以获取回调数据，Lin-MiNi的Button组件的回调函数设置方式同样与小程序原生Button保持一致。")])]),t._v(" "),a("p",[t._v("例如在获取用户信息时，你可以这样设置回调函数："),a("code",[t._v('bind:getuserinfo="getUserInfo"')]),t._v("。")]),t._v(" "),a("h3",{attrs:{id:"示例代码-10"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-10"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v('<l-button bind:getuserinfo="getUserInfo" open-type="getUserInfo"></l-button>\n')])])]),a("h2",{attrs:{id:"用户案例"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#用户案例"}},[t._v("#")]),t._v(" 用户案例")]),t._v(" "),a("p",[t._v("浏览完以上内容，您大概已经了解Button组件的"),a("code",[t._v("特殊样式用法")]),t._v("以及"),a("code",[t._v("按钮的微信开放能力")]),t._v("。")]),t._v(" "),a("p",[t._v("下面我们来浏览一个在实际开发中较为常见的用户案例，案例实现效果图如下所示：")]),t._v(" "),a("p",[t._v(":::img\n"),a("img",{attrs:{src:"/screenshots/button/9.png",alt:"height=50"}}),t._v("\n:::")]),t._v(" "),a("p",[t._v("通过效果图，我们来分析下怎样去实现该案例。总体来讲可分为两部分:")]),t._v(" "),a("ol",[a("li",[t._v("设置Button组件的"),a("code",[t._v("special")]),t._v("属性为"),a("code",[t._v("true")]),t._v("，然后将自定义代码插入插槽中。")]),t._v(" "),a("li",[t._v("将Button组件的"),a("code",[t._v("open-type")]),t._v("属性设置为"),a("code",[t._v("contact")]),t._v("实现客服功能。")])]),t._v(" "),a("p",[t._v("以下是实现该案例的代码。")]),t._v(" "),a("h3",{attrs:{id:"示例代码-11"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#示例代码-11"}},[t._v("#")]),t._v(" 示例代码")]),t._v(" "),a("div",{staticClass:"language-wxml extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v(' \x3c!-- wxml文件 --\x3e\n <l-button special="{{true}}" open-type="contact">\n    <view class="container">\n      <l-icon size="40" name="customer-service" color="#3683d6" />\n      <text class="describe">客服</text>\n    </view>\n  </l-button>\n')])])]),a("div",{staticClass:"language-wxss extra-class"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[t._v("  /* wxss文件 */\n  .container {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .describe {\n    color: #3683d6;\n    font-size: 28rpx;\n    margin-left:20rpx;\n  }\n")])])]),a("h2",{attrs:{id:"按钮属性"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮属性"}},[t._v("#")]),t._v(" 按钮属性")]),t._v(" "),a("blockquote",[a("p",[t._v("除本文档列出的参数之外，微信原生Button的参数同样支持，具体参考"),a("a",{attrs:{href:"https://developers.weixin.qq.com/miniprogram/dev/component/button.html",target:"_blank",rel:"noopener noreferrer"}},[t._v("微信Button组件文档"),a("OutboundLink")],1),t._v("。")])]),t._v(" "),a("div",{staticClass:"custom-block tip"},[a("p",{staticClass:"custom-block-title"},[t._v("TIP")]),t._v(" "),a("p",[a("a",{attrs:{href:"https://developers.weixin.qq.com/miniprogram/dev/component/button.html",target:"_blank",rel:"noopener noreferrer"}},[t._v("微信Button组件文档"),a("OutboundLink")],1),t._v("指出将"),a("code",[t._v("button")]),t._v(" 封装在自定义组件中，而 "),a("code",[t._v("from")]),t._v(" 在自定义组件外，将会使这个 "),a("code",[t._v("button")]),t._v(" 的 "),a("code",[t._v("form-type")]),t._v(" 失效。\n由于本组件由原生Button进行的封装，所以导致 "),a("code",[t._v("form-type")]),t._v(" 属性无法获取到表单组件值。此处建议使用原生Button组件。")])]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",{staticStyle:{"text-align":"left"}},[t._v("参数")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("说明")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("类型")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("可选值")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("默认值")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("版本号")])])]),t._v(" "),a("tbody",[a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("size")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮尺寸")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("medium/large/mini/long")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("medium")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("type")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮类型")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("warning/success/error/default")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("default")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("plain")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮是否镂空")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("false")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("disabled")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮是否禁用")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("false")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("loading")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("是否为加载中按钮")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("false")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("bg-color")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮背景颜色")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("height")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮高度")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Number")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("width")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮宽度")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Number")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("shape")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮形状")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("square/circle/semicircle")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("circle")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("icon")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮内icon图标")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("icon-size")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮内icon大小")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Number")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("20rpx")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("icon-color")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮内icon颜色")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("#fff")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("special")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("特殊按钮")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("false")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("open-type")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("微信开放能力")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}})]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("disabled-hover")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("禁用 hover 效果")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("false")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("0.8.12")])])])]),t._v(" "),a("h2",{attrs:{id:"按钮外部样式类"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮外部样式类"}},[t._v("#")]),t._v(" 按钮外部样式类")]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",{staticStyle:{"text-align":"left"}},[t._v("外部样式类名")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("说明")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("备注")])])]),t._v(" "),a("tbody",[a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("l-class")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("覆盖按钮区域自定义外部样式类")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("如果在l-class中使用margin-left或margin-right，请使用该外部样式进行代替，其他的属性依旧使用l-class即可")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("l-label-class")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("覆盖按钮区域自定义外部样式类")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("l-icon-class")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("覆盖icon的自定义外部样式类")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("l-hover-class")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("自定义按钮点击态外部样式类")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])])])]),t._v(" "),a("h2",{attrs:{id:"按钮插槽"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮插槽"}},[t._v("#")]),t._v(" 按钮插槽")]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",{staticStyle:{"text-align":"left"}},[t._v("插槽名称")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("说明")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("备注")])])]),t._v(" "),a("tbody",[a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("-")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("自定义按钮显示内容")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])])])]),t._v(" "),a("h2",{attrs:{id:"按钮事件"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#按钮事件"}},[t._v("#")]),t._v(" 按钮事件")]),t._v(" "),a("table",[a("thead",[a("tr",[a("th",{staticStyle:{"text-align":"left"}},[t._v("事件名称")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("说明")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("返回值")]),t._v(" "),a("th",{staticStyle:{"text-align":"left"}},[t._v("备注")])])]),t._v(" "),a("tbody",[a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("bind:lintap")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮在非禁用状态下点击所触发的事件")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("bind:contact")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("客服消息回调")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("bind:getphonenumber")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("获取用户手机号回调")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("bind:error")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("当使用开放能力时，发生错误的回调")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("bind:opensetting")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("在打开授权设置页后回调")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("bind:getuserinfo")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("用户点击该按钮时，会返回获取到的用户信息，回调的detail数据与"),a("a",{attrs:{href:"https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/wx.getUserInfo.html",target:"_blank",rel:"noopener noreferrer"}},[t._v("wx.getUserInfo"),a("OutboundLink")],1),t._v("返回的一致")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("-----")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("---")])])])]),t._v(" "),a("RightMenu")],1)}),[],!1,null,null,null);e.default=v.exports}}]);