React EasyUI 数据表格下拉框
表格下拉框( combogrid )把可编辑的文本框和下拉数据网络面板结合起来。 表格下拉框( ComboGrid )提供了选择某个项目的键盘导航支持。
属性列表
名称 | 数据类型 | 作用描述 | 默认值 |
---|---|---|---|
value | string, number, array | 字段值。 | null |
data | array | 要加载的数据。 | [ ] |
valueField | string | 绑定到此组件的底层数据值名称。 | id |
textField | string | 绑定到此组件的基础数据字段名。 | text |
editable | boolean | 定义用户是否可以直接在字段中键入文本。 | false |
注:
- 继承: ComboBase 。
使用方法
<ComboGrid
panelStyle={{ width: 500 }}
valueField="itemid"
textField="name"
data={this.state.data}
value={this.state.value}
onChange={(value) => this.setState({ value: value })}
>
<GridColumn field="itemid" title="Item ID"></GridColumn>
<GridColumn field="name" title="Name"></GridColumn>
<GridColumn field="listprice" title="List Price" align="right"></GridColumn>
<GridColumn field="unitcost" title="Unit Cost" align="right"></GridColumn>
<GridColumn field="attr" title="Attribute" width="30%"></GridColumn>
<GridColumn field="status" title="Status" align="center"></GridColumn>
</ComboGrid>