原生选择器API

React NativeSelect 组件的 API 参考文档。了解此导出模块的 props、CSS 和其他 API。

演示

有关此 React 组件用法的示例和详细信息，请访问组件演示页面

import NativeSelect from '@mui/material/NativeSelect';
// or
import { NativeSelect } from '@mui/material';

<Select native /> 的替代方案，捆绑包大小占用空间更小。

Input 组件的 Props 也可用。

名称	类型	默认值	描述
children	node	-	用于填充选择器的选项元素。可以是 `<option>` 元素。
classes	object	{}	覆盖或扩展应用于组件的样式。有关更多详细信息，请参见下面的 CSS 类 API。
IconComponent	elementType	ArrowDropDownIcon	显示箭头的图标。
input	element	<Input />	一个 `Input` 元素；不必是 material-ui 特定的 `Input`。
inputProps	object	-	Attributes 应用于 `select` 元素。
onChange	func	-	当选择菜单项时触发的回调。签名:`function(event: React.ChangeEvent) => void` `event` 回调的事件源。您可以通过访问 `event.target.value`（字符串）来提取新值。
sx	Array<func \| object \| bool> \| func \| object	-	允许定义系统覆盖以及其他 CSS 样式的系统属性。有关更多详细信息，请参见 `sx` 页面。
value	any	-	`input` 值。DOM API 将其转换为字符串。
variant	'filled' \| 'outlined' \| 'standard'	-	要使用的变体。

ref 被转发到根元素。

虽然上面没有明确文档说明，但 Input 组件的 props 在 NativeSelect 中也可用。您可以利用这一点来定位嵌套组件。

您可以使用 MuiNativeSelect 通过主题更改此组件的默认 props。

这些类名对于使用 CSS 设置样式很有用。当触发特定状态时，它们将应用于组件的插槽。

类名	规则名称	描述
.Mui-disabled		应用于 select 组件 `disabled` 类的状态类。
.Mui-error		应用于 select 组件 `error` 类的状态类。
.MuiNativeSelect-filled	filled	如果 `variant="filled"`，则应用于 select 组件的样式。
.MuiNativeSelect-icon	icon	应用于图标组件的样式。
.MuiNativeSelect-iconFilled	iconFilled	如果 `variant="filled"`，则应用于图标组件的样式。
.MuiNativeSelect-iconOpen	iconOpen	如果弹出窗口打开，则应用于图标组件的样式。
.MuiNativeSelect-iconOutlined	iconOutlined	如果 `variant="outlined"`，则应用于图标组件的样式。
.MuiNativeSelect-iconStandard	iconStandard	如果 `variant="standard"`，则应用于图标组件的样式。
.MuiNativeSelect-multiple	multiple	如果 `multiple={true}`，则应用于 select 组件的样式。
.MuiNativeSelect-nativeInput	nativeInput	应用于底层原生输入组件的样式。
.MuiNativeSelect-outlined	outlined	如果 `variant="outlined"`，则应用于 select 组件的样式。
.MuiNativeSelect-root	root	应用于根元素的样式。
.MuiNativeSelect-select	select	应用于 select 组件 `select` 类的样式。
.MuiNativeSelect-standard	standard	如果 `variant="standard"`，则应用于 select 组件的样式。

您可以使用以下自定义选项之一覆盖组件的样式

如果您在此页面中找不到信息，请考虑查看组件的实现以获取更多详细信息。