1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 | import React, { Component } from 'react';
|
9 | import Transfer from '../../src';
|
10 |
|
11 |
|
12 | class Demo2 extends React.Component {
|
13 | state = {
|
14 | mockData: [],
|
15 | targetKeys: [],
|
16 | }
|
17 | componentDidMount() {
|
18 | this.getMock();
|
19 | }
|
20 | getMock = () => {
|
21 | const targetKeys = [];
|
22 | const mockData = [];
|
23 | for (let i = 0; i < 20; i++) {
|
24 | const data = {
|
25 | key: i.toString(),
|
26 | title: `content${i + 1}`,
|
27 | description: `description of content${i + 1}`,
|
28 | chosen: Math.random() * 2 > 1,
|
29 | };
|
30 | if (data.chosen) {
|
31 | targetKeys.push(data.key);
|
32 | }
|
33 | mockData.push(data);
|
34 | }
|
35 | this.setState({ mockData, targetKeys });
|
36 | }
|
37 | filterOption = (inputValue, option) => {
|
38 | return option.title.indexOf(inputValue) > -1;
|
39 | }
|
40 | handleChange = (targetKeys) => {
|
41 | this.setState({ targetKeys });
|
42 | }
|
43 | render() {
|
44 | return (
|
45 | <Transfer
|
46 | dataSource={this.state.mockData}
|
47 | showSearch
|
48 | filterOption={this.filterOption}
|
49 | targetKeys={this.state.targetKeys}
|
50 | onChange={this.handleChange}
|
51 | render={item => item.title}
|
52 | />
|
53 | );
|
54 | }
|
55 | }
|
56 |
|
57 |
|
58 | export default Demo2
|