antd-extensions

[![NPM Version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] [![Coverage Status][coverage-image]][coverage-url] ![][david-url] ![][dt-url] ![][license-url]

Usage no npm install needed!

<script type="module">
  import antdExtensions from 'https://cdn.skypack.dev/antd-extensions';
</script>

README

antd-extensions

NPM Version Build Status Coverage Status

Test

npm test

采用Jest + Enzyme进行单元测试

目前单元测试还在补充,望有志之士一起加入。 单测在组件目录下的tests中,写单测时请尽量保证覆盖率 > 95% 并考虑边界情况,如果不能做到测试用例全覆盖,优先覆盖底层逻辑。

Install

npm install --save antd-extensions

ant-design的 DFocus 扩展组件库,帮助开发者选择需要的组件,并迅速进入角色。

完整 API 使用文档,请这边走

Usage

// 日期区间选择器
import React, { Component } from 'react'
import { TimeRangePicker } from 'antd-extensions'

class Example extends Component {
  constructor(props) {
    super(props)

    this.state = {
      value: {
        type: 'CUSTOMIZE',
        ranges: [1533081600000, 1534377600000]
      }
    }
  }

  _handleChange = value => {
    console.log(`You're selection is ${JSON.stringify(value)}`)
    this.setState({
      value
    })
  }

  render() {
    return (
      <TimeRangePicker
        value={this.state.value}
        onChange={this._handleChange}
        labels={{
          BTN_ALL: 'All',
          BTN_LAST_WEEK: 'Last week',
          BTN_LAST_MONTH: 'Last month',
          BTN_CUSTOMIZE: 'Customize',
          PLACEHOLDER_START: 'Start',
          PLACEHOLDER_END: 'End'
        }}
        disabledDate={current =>
          current &&
          current >
            moment()
              .endOf('day')
              .subtract(1, 'days')
        }
      />
    )
  }
}

LICENSE

MIT License