react-bootstrap-table2/packages/react-bootstrap-table2-editor/src/dropdown-editor.js
2018-09-01 17:00:34 +08:00

65 lines
1.4 KiB
JavaScript

/* eslint no-return-assign: 0 */
import React, { Component } from 'react';
import cs from 'classnames';
import PropTypes from 'prop-types';
class DropDownEditor extends Component {
componentDidMount() {
const { defaultValue, didMount } = this.props;
this.select.value = defaultValue;
this.select.focus();
if (didMount) didMount();
}
getValue() {
return this.select.value;
}
render() {
const { defaultValue, didMount, className, options, ...rest } = this.props;
const editorClass = cs('form-control editor edit-select', className);
const attr = {
...rest,
className: editorClass
};
return (
<select
{ ...attr }
ref={ node => this.select = node }
defaultValue={ defaultValue }
>
{
options.map(({ label, value }) => (
<option key={ value } value={ value }>{ label }</option>
))
}
</select>
);
}
}
DropDownEditor.propTypes = {
defaultValue: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number
]),
className: PropTypes.string,
style: PropTypes.object,
options: PropTypes.oneOfType([
PropTypes.arrayOf(PropTypes.shape({
label: PropTypes.string,
value: PropTypes.any
}))
]).isRequired,
didMount: PropTypes.func
};
DropDownEditor.defaultProps = {
className: '',
defaultValue: '',
style: {},
didMount: undefined
};
export default DropDownEditor;