button 样式_使用Vue3.0新特性造轮子 WidgetUI3.0（Button按钮组件）

我们先看一下组件效果图：

Button组件接收props参数：

title (类型 String)

设置按钮显示的文本

默认值 “button”

type (类型 String)

设置按钮样式。

默认值 “default”，可选(“default”、“primary”、“danger”)

bgcolor (类型 String)

设置按钮背景色。

radius (类型 String)

设置按钮圆角大小。

默认值 “0.2” 单位 "rem"

width (类型 String)

设置按钮宽度。

默认值 “0”，随父级的宽度，单位 "rem"

height (类型 String)

设置按钮高度。

默认值 “0”，单位 "rem"

color (类型 String)

设置按钮文本颜色。

默认值 “#333”。

dashed (类型 Boolean)

按钮边框是否虚线，需配合 “dashedcolor” 参数一起使用

默认值 “#333”。

dashedcolor (类型 String)

按钮边框颜色。

效果图代码如下：

具体的Button组件源码，请前往github地址获取。

https://github.com/AntJavascript/WidgetUI3.0/blob/master/Button.vue