@aliretail/react-whale-checked-all/demo/CheckedAll/example.md

whale-checked-all

---
title: CheckedAll-Simple
order: 1
---

```jsx
import React from 'react';
import ReactDOM from 'react-dom';
import WhaleCheckedAll from '@aliretail/react-whale-checked-all';

// 数据源
// const list = ['UNCOMMITTED', 'WAIT_APPROVAL', 'CANCELED'];
// 或者
const list = [{
  value: 'UNCOMMITTED',
  label: '未提交'
}, {
  value: 'WAIT_APPROVAL',
  label: '提交中'
}, {
  value: 'CANCELED',
  label: '已撤回'
}];

class Demo extends React.Component {
  constructor(props, context) {
    super(props, context);

    this.state = {
      value: []
    };
  }

  handleChange = (newValue) => {
    console.log(newValue)
    this.setState({
      value: newValue
    });
  }

  render() {
    const { value } = this.state;

    return (
      <WhaleCheckedAll
        value={value}
        dataSource={list}
        onChange={this.handleChange}
      />
    );
  }
}
ReactDOM.render(<Demo />, mountNode);
```