# @beisen-platform/base-button

> 按钮用于开始一个即时操作。基础组件的按钮中有主要按钮、次要按钮、弱化按钮、文字按钮、图标按钮；还有不同尺寸可选择

Latest version **1.0.9-rc.1** (published 2019-04-29) · ISC license · 0 weekly downloads

## Install

```sh
npm install @beisen-platform/base-button
pnpm add @beisen-platform/base-button
yarn add @beisen-platform/base-button
bun add @beisen-platform/base-button
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.9-rc.1 |
| Published | 2019-04-29 |
| First published | 2018-11-28 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 787.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | beisen |
| Maintainers | beisencorp |
| Keywords | beisen, react-component, es6 |

## Links

- npm: https://www.npmjs.com/package/@beisen-platform/base-button
- Repository: http://gitlab.beisencorp.com/ux-cnpm/ux-base-button
- npm.io page: https://npm.io/package/@beisen-platform/base-button

## Dependencies (3)

- [@beisen/beaute-core](https://npm.io/package/@beisen/beaute-core.md) ^1.0.3
- [@beisen-platform/tool-tip](https://npm.io/package/@beisen-platform/tool-tip.md)
- [@beisen-platform/common-func](https://npm.io/package/@beisen-platform/common-func.md)

## Recent versions

- 1.0.9-rc.1 (latest) — 2019-04-29
- 1.0.9 — 2019-04-17
- 1.0.8 — 2019-04-17
- 1.0.7 — 2019-04-16
- 1.0.6 — 2019-04-14
- 1.0.5 — 2019-04-09
- 1.0.4 — 2019-03-15
- 1.0.3 — 2019-01-25
- 1.0.2 — 2019-01-15
- 1.0.1 — 2019-01-11
- 1.0.0 — 2019-01-09
- 0.1.48 — 2018-11-28

## README

# base-button 使用说明

## 项目运行

1. cnpm install 或 npm install cnpm使用教程

2. npm run dev （开发环境打包 port:8080）

3. npm run test （测试用例）

4. npm run build （生产环境打包）

## base-button参数

```javascript
{
  /** 按钮类型(string)。参数：
        1.默认: 'default'
        2.弱化按钮：'weaken'
        3.连接按钮：'link'
    */
  bsStyle: 'default',

  /** 按钮尺寸(string)。参数：
      1.默认: 'default'
      2.小按钮：'small'
      3.块状按钮：'block'
  */
  bsSize: 'default',

  /** 是否选中(Boolean)。参数：
        1.默认未选中:false
        2.选中:true
    */
  active: true,

  /** 是否禁用(Boolean)。参数：
      1.默认不禁用:false
      2.禁用:true
  */
  disabled: true,

  /** 如果该字段有定义且非空，return（<a/>）,否则return（</button>）*/
  href: '',

  /** 如果禁用出现tips的提示原因 */
  tipsReason: '禁用理由是balalalalalalalal',

  /** ToolTip的tipsDes属性 */
  tipsDes:'',

  /** 禁用后总是出现tips提示，只有disabled为true生效 */
  alwaysShowTips: true,

  /** 显示文本(string) */
  title: '测试11',

  /** 是否显示按钮 */
  hidden: false,

  /** 埋点数据 */
  dataUdt: 'id',

  /** 最大宽度，默认为"" ,超出后，超出的部门显示... */
  maxWidth: '20px',

  /** 点击后事件回调 **/
  onClick: function (target, onClick, btnInfo) {
    console.log(target);  //输出e
    console.log(onClick); //输出true
    console.log(btnInfo); //输出this.state
  }
}
```

## base-button调用方法

1.安装npm组件包

```
npm install @beisen/base-button --save-dev
```

2.引用组件

  ```javascript
import BaseButton from "@beisen/base-button"
  ```


3. 传入参数

	该参数为上述参数，传入方式使用: {...参数}
	```javascript
	{
	    "bsStyle":"default"
                            /**按钮类型(string)。参数：
                                1.默认:“default”
                                2.弱化按钮：“weaken”
                                3.连接按钮：“link”
                            **/
	    ,"bsSize":"default"
	                                /**按钮尺寸(string)。参数：
	                                    1.默认:“default”
	                                    2.小按钮：“small”
	                                    3.块状按钮：“block”
	                                **/
	    ,"active":true
	                                /**是否选中(Boolean)。参数：
	                                    1.默认未选中:false
	                                    2.选中:true
	                                **/
	    ,"disabled":true
	                                /**是否禁用(Boolean)。参数：
	                                    1.默认不禁用:false
	                                    2.禁用:true
	                                **/
	    ,"href":""          /**如果该字段有定义且非空，return（<a/>）,否则return（</button>）**/
	    ,"title":"测试11"         /**显示文本(string)**/
	    ,"hidden":false   //是否显示按钮
	    ,"maxWidth":"20px"          //最大宽度，默认为"" ,超出后，超出的部门显示...
	    ,"onClick": function(target,onClick,btnInfo) {
          console.log(target);  //输出e
          console.log(onClick); //输出true
          console.log(btnInfo); //输出this.state
        } /**点击后事件回调**/
	}

	render () {
			return (
				<BaseButton {...this.state.BaseData} />
			)
		}
	```

---
_Source: https://npm.io/package/@beisen-platform/base-button · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._