zent/src/select/demos/1.basic.md

一套前端设计语言和基于React的实现

---
order: 1
zh-CN:
	title: 基础用法
	placeholder: 选择一项
	empty: 无选项
	longest: 君不见，黄河之水天上来，奔流到海不复回
en-US:
	title: Basic Usage
	placeholder: Select an option..
	empty: No Options
	longest: Do you not see the Yellow River come from the sky, Rushing into the sea and never come back?
---

```js
import { Select } from 'zent';

const options = [
	{
		key: '1',
		text: 'Option 1',
	},
	{
		key: '2',
		text: 'Option 2',
	},
	{
		key: '3',
		text: 'Option 3',
		disabled: true,
	},
		{
		key: '4',
		text: `{i18n.longest}`,
	},
];

ReactDOM.render(
	<div className="zent-demo-select-basic">
		<Select clearable options={options} placeholder="{i18n.placeholder}" />
		<Select clearable options={[]} placeholder="{i18n.empty}" />
		<Select clearable options={options} disabled placeholder="{i18n.placeholder}" />
		<Select clearable options={options} placeholder="{i18n.placeholder}" />
		<Select clearable options={options} placeholder="{i18n.placeholder}" size={'m'} />
	</div>,
	mountNode
);
```

<style>
	.zent-demo-select-basic > * {
		margin-bottom: 10px;
	}
</style>