@beisen/selected-list

selected-list

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
@beisen/selected-list
Minified + gzip package size for @beisen/selected-list in KB

Readme

ux-selected-list使用说明

项目运行

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

  2. npm run dev (开发环境打包 port:8080)

  3. npm run test (测试用例)

  4. npm run build (生产环境打包)

ux-selected-list参数

  {
      totalCount: 1,//数据总数
      hasCount: 1,//选择数据总数
      openCount: true, //是否显示 选择数据总数/数据总数
      titleText: "已选择",//组件标题
      nullText: "请在左侧选择",//组件未选定数据时显示文本
      resultsData: [{
        name: '测试名称',
        pname: '测试数据'
      },{
        name: '测试名称',
        pname: '测试数据'
      }],
      clearResultsData: self.clearResultsData //清除当前已选数据,self=this在constructor中声明
  }

ux-selected-list调用方法

1.安装npm组件包

npm install @beisen/ux-selected-list --save-dev

2.引用组件

import SelectedList from "@beisen/ux-selected-list"

3.传入参数

该参数为上述参数,传入方式使用: {...参数}

class Demo extends Component {
constructor(props) {
 super(props)
  let self = this;
  this.state = {
    totalCount: 1,//数据总数
    hasCount: 1,//选择数据总数
    openCount: true, //是否显示 选择数据总数/数据总数
   titleText: "已选择",//组件标题
    nullText: "请在左侧选择",//组件未选定数据时显示文本
    resultsData: [{
      name: '测试名称',
      pname: '测试数据'
    },{
      name: '测试名称',
      pname: '测试数据'
    }],
    clearResultsData: self.clearResultsData //清除当前已选数据,self=this在constructor中声明
  }
}
clearResultsData = index => {
  if(index==undefined) {
  this.setState({resultsData: []})
  } else {
    let _resultsData = this.state.resultsData;
    let _hasCount = this.state.hasCount;
    // if(_hasCount == 0) return;
    _resultsData.splice(index, 1);
    _hasCount = _hasCount - 1;
    this.setState({resultsData: _resultsData, hasCount: _hasCount});
  }
}
render() {
 return (
         <div >
      <Selected_List {...this.state}  />
    </div >
  )
}
}
render(<Demo />, document.getElementById('content'))

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.