(window.webpackJsonp=window.webpackJsonp||[]).push([[53],{471:function(t,e,a){"use strict";a.r(e);var l=a(46),s=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(" Button 按钮")]),t._v(" "),a("h2",{attrs:{id:"概述"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#概述"}},[t._v("#")]),t._v(" 概述")]),t._v(" "),a("p",[t._v("基础组件，触发业务逻辑时使用。")]),t._v(" "),a("h2",{attrs:{id:"代码示例"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#代码示例"}},[t._v("#")]),t._v(" 代码示例")]),t._v(" "),a("ClientOnly",[a("row",[a("cell",{staticClass:"pr-20",attrs:{span:"12"}},[a("componetTemplate",{attrs:{title:"按钮类型",template:"ui/templates/button/1.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[a("Wb-button",[t._v("Default")]),t._v(" "),a("Wb-button",{attrs:{type:"ghost"}},[t._v("Ghost")]),t._v(" "),a("Wb-button",{attrs:{type:"text"}},[t._v("Text")]),t._v(" "),a("Wb-button",{attrs:{type:"primary"}},[t._v("Primary")]),t._v(" "),a("Wb-button",{attrs:{type:"info"}},[t._v("Info")]),t._v(" "),a("Wb-button",{attrs:{type:"success"}},[t._v("Success")]),t._v(" "),a("Wb-button",{attrs:{type:"warn"}},[t._v("Warn")]),t._v(" "),a("Wb-button",{attrs:{type:"error"}},[t._v("Error")])]},proxy:!0},{key:"description",fn:function(){return[a("p",[t._v("按钮类型有：默认按钮、主按钮、幽灵按钮、文字按钮以及四种颜色按钮。")]),t._v(" "),a("p",[t._v("通过设置type为primary、ghost、text、info、success、warn、error创建不同样式的按钮，不设置为默认样式。")])]},proxy:!0}])}),t._v(" "),a("componetTemplate",{attrs:{title:"图标按钮及按钮形状",template:"ui/templates/button/3.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[a("Wb-button",{attrs:{icon:"md-search",circle:""}}),t._v(" "),a("Wb-button",{attrs:{icon:"md-search",circle:""}},[t._v("查询")]),t._v(" "),a("Wb-button",{attrs:{icon:"md-search"}},[t._v("查询")])]},proxy:!0},{key:"description",fn:function(){return[a("p",[t._v("通过设置icon属性在Button内部嵌入一个Icon, 显示在Button内部的左边")]),t._v(" "),a("p",[t._v("通过设置circle属性，可以将Button显示为圆角")])]},proxy:!0}])})],1),t._v(" "),a("cell",{staticClass:"pl-20",attrs:{span:"12"}},[a("componetTemplate",{attrs:{title:"禁用",template:"ui/templates/button/2.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[a("Wb-button",{attrs:{disabled:""}},[t._v("Default")]),t._v(" "),a("Wb-button",{attrs:{type:"ghost",disabled:""}},[t._v("Ghost")]),t._v(" "),a("Wb-button",{attrs:{type:"text",disabled:""}},[t._v("Text")]),t._v(" "),a("Wb-button",{attrs:{type:"primary",disabled:""}},[t._v("Primary")]),t._v(" "),a("Wb-button",{attrs:{type:"info",disabled:""}},[t._v("Info")]),t._v(" "),a("Wb-button",{attrs:{type:"success",disabled:""}},[t._v("Success")]),t._v(" "),a("Wb-button",{attrs:{type:"warn",disabled:""}},[t._v("Warn")]),t._v(" "),a("Wb-button",{attrs:{type:"error",disabled:""}},[t._v("Error")])]},proxy:!0},{key:"description",fn:function(){return[a("p",[t._v("当设置disabled属性为true时，按钮不可点击")])]},proxy:!0}])}),t._v(" "),a("componetTemplate",{attrs:{title:"长按钮",template:"ui/templates/button/4.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[a("Wb-button",{attrs:{type:"success",long:""}},[t._v("确认提交")]),t._v(" "),a("Wb-button",{attrs:{type:"error",long:""}},[t._v("确认删除")])]},proxy:!0},{key:"description",fn:function(){return[a("p",[t._v("Button组件的宽度默认是通过内容撑开，但是当设置long属性后按钮为100%宽度")])]},proxy:!0}])})],1)],1)],1),t._v(" "),a("h2",{attrs:{id:"api"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#api"}},[t._v("#")]),t._v(" API")]),t._v(" "),a("h3",{attrs:{id:"props"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#props"}},[t._v("#")]),t._v(" Props")]),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("type")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("按钮的类型，可选值是primary、ghost、text、info、success、warn、error或者无")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("null")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("long")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("控制按钮是否显示为100%宽度")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("false")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("circle")]),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("false")])]),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("false")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("icon")]),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("null")])]),t._v(" "),a("tr",[a("td",{staticStyle:{"text-align":"left"}},[t._v("control")]),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("300")])])])]),t._v(" "),a("h3",{attrs:{id:"events"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#events"}},[t._v("#")]),t._v(" Events")]),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("click")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("单击按钮触发")]),t._v(" "),a("td",{staticStyle:{"text-align":"left"}},[t._v("(event) => void")])])])])],1)}),[],!1,null,null,null);e.default=s.exports}}]);