bee-transfer v2.0.20

bee-transfer

两框之间的元素迁移，非常直观且有效。一个或多个元素选择后点击方向按钮转到另一列框中。左栏是“源”，右边是“目标”

使用

使用单独的transfer包

组件引入

先进行下载bee-transfer包

npm install --save bee-transfer

组件调用

import Transfer from 'bee-transfer';

const mockData = [];
for (let i = 0; i < 20; i++) {
  mockData.push({
    key: i.toString(),
    title: `content${i + 1}`,
    description: `description of content${i + 1}`,
    disabled: i % 3 < 1,
  });
}


ReactDOM.render(
        <Transfer
		    dataSource={mockData}
		    titles={['Source', 'Target']}
		    render={item => item.title}
		  />
        , document.getElementById('target'));

样式引入

• 可以使用link引入build目录下Transfer.css

<link rel="stylesheet" href="./node_modules/bee-transfer/build/Transfer.css">

• 可以在js中import样式

import "./node_modules/bee-transfer/src/Transfer.scss"
//或是
import "./node_modules/bee-transfer/build/Transfer.css"

API

开发调试

$ npm install -g bee-tools
$ git clone https://github.com/tinper-bee/bee-transfer
$ cd bee-transfer
$ npm install
$ npm run dev