0.0.3 • Published 6 years ago

helpcomponent-test v0.0.3

Weekly downloads
-
License
ISC
Repository
-
Last release
6 years ago

效果图

npm.io

npm.io

npm.io

安装组件

npm install helpcomponent --save

引入组件

import HelpComponent from 'helpcomponent'

使用组件

   <HelpComponent label="项目名称" inputValue={state.inputValue}
                   required={true} editable={false} readOnly={false} headerTitle="请选择项目名称"
                   helpType="hot" hotName="Project_Name_Hot" hotTextField="Project_Name"
                   helpValueField="ID" helpTextFieldArray={["Project_Name"]}
                   loadData={this.viewModel.loadProjectData}
                   afterSelectItem={this.viewModel.afterSelectProject_Name}>
    </HelpComponent>
                        
                        
                        
    loadProjectData(layer = 0, itemId, searchingText = "", pageIndex, pageSize) {
        let observable = Observable.create(function (observer) {
            setTimeout(() => {
                observer.next(projectMockData);
            }, 5000)

        });
        return observable;
    }


    afterSelectProject_Name(selectedProject) {
        this.setState({
            inputValue: selectedProject.Project_Name
        });
    }

组件属性

属性描述类型默认值必选
labelinput标签stringfalse
placeholderplaceholderstringfalse
inputValueinput值(受控)stringtrue
requiredinput是否必填booleanfalsefalse
editableinput是否可编辑booleanfalsefalse
readOnly是否可以选择帮助booleanfalsefalse
headerTitle帮助页标题string"请选择"false
helpValueField帮助数据标识字段string‘ID’true
helpTextField帮助展示字段数组(例:"ID","Name"arraytrue
helpType帮助类型(常用:'hot' ,收藏: 'favor')stringfalse
hotLimit常用项最大个数number4false
hotName常用项标识(helpType为hot时必填)stringtrue
hotTextField常用项展示字段(helpType为hot时必填)stringtrue
isTree是否树类型booleanfalsefalse
favorName收藏项标识(helpType为favor时必填)stringtrue
showMessage是否显示校验提示booleanfalsefalse
message校验提示信息(showMessge为true时展示)stringfalse
onInputChange输入框change事件回调 (value)=>voidfalse
afterSelectItem选中帮助项后的回调 (selectedItem)=>voidfalse
loadData加载帮助数据的回调,返回值必须为Observable类型(layer,itemId,searchingText,pageIndex,pageSize) =>Observabletrue