Skip to content

Commit

Permalink
add single demo without search
Browse files Browse the repository at this point in the history
  • Loading branch information
superRaytin committed Apr 26, 2016
1 parent 819df27 commit d22d4ac
Show file tree
Hide file tree
Showing 2 changed files with 98 additions and 0 deletions.
1 change: 1 addition & 0 deletions examples/single-without-search.html
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
placeholder
97 changes: 97 additions & 0 deletions examples/single-without-search.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
/* eslint no-console: 0 */

import React from 'react';
import Select, { Option } from 'rc-select';
import 'rc-select/assets/index.less';
import ReactDOM from 'react-dom';

const Test = React.createClass({
getInitialState() {
return {
destroy: false,
value: String(9),
};
},

onChange(e) {
let value;
if (e && e.target) {
value = e.target.value;
} else {
value = e;
}
this.setState({
value,
});
},

onDestroy() {
this.setState({
destroy: 1,
});
},

render() {
if (this.state.destroy) {
return null;
}
return (
<div style={{ margin: 20 }}>
<div style={{ height: 150 }}/>

<h2>Single Select without search</h2>

<div style={{ width: 300 }}>
<Select
value={this.state.value}
placeholder="placeholder"
dropdownMenuStyle={{ maxHeight: 200, overflow: 'auto' }}
style={{ width: 500 }}
allowClear
showSearch={false}
optionLabelProp="children"
optionFilterProp="text"
onChange={this.onChange}
>
<Option value="01" text="jack">
<b
style={{
color: 'red',
}}
>
jack
</b>
</Option>
<Option value="11" text="lucy">lucy</Option>
<Option value="21" disabled text="disabled">disabled</Option>
<Option value="31" text="yiminghe">yiminghe</Option>
{[0, 1, 2, 3, 4, 5, 6, 7, 8, 9].map((i) => {
return <Option key={i} text={String(i)}>{i}</Option>;
})}
</Select>
</div>

<h2>native select</h2>
<select
value={this.state.value}
style={{ width: 500 }}
onChange={this.onChange}
>
<option value="01">jack</option>
<option value="11">lucy</option>
<option value="21" disabled>disabled</option>
<option value="31">yiminghe</option>
{[1, 2, 3, 4, 5, 6, 7, 8, 9].map((i) => {
return <option value={i} key={i}>{i}</option>;
})}
</select>

<p>
<button onClick={this.onDestroy}>destroy</button>
</p>
</div>
);
},
});

ReactDOM.render(<Test />, document.getElementById('__react-content'));

0 comments on commit d22d4ac

Please sign in to comment.