{"componentChunkName":"component---src-templates-post-template-js","path":"/zh-CN/input/select","result":{"data":{"current":{"frontmatter":{"title":"Select 选择器","order":46,"brief":"用户可以通过 Select 选择器从一个选项集合中去选中一个或多个选项，并呈现最终选择结果","icon":"doc-select"},"fields":{"type":"input"},"tableOfContents":{"items":[{"url":"#代码演示","title":"代码演示","items":[{"url":"#如何引入","title":"如何引入"},{"url":"#基本使用","title":"基本使用"},{"url":"#以数组形式传入-option","title":"以数组形式传入 Option"},{"url":"#多选","title":"多选"},{"url":"#分组","title":"分组"},{"url":"#不同尺寸","title":"不同尺寸"},{"url":"#不同校验状态样式","title":"不同校验状态样式"},{"url":"#配置前缀后缀清除按钮","title":"配置前缀、后缀、清除按钮"},{"url":"#在顶部底部渲染附加项","title":"在顶部/底部渲染附加项"},{"url":"#受控组件","title":"受控组件"},{"url":"#动态修改-options","title":"动态修改 Options"},{"url":"#联动","title":"联动"},{"url":"#开启搜索","title":"开启搜索"},{"url":"#搜索框位置","title":"搜索框位置"},{"url":"#远程搜索","title":"远程搜索"},{"url":"#自定义搜索逻辑","title":"自定义搜索逻辑"},{"url":"#自定义已选项标签渲染","title":"自定义已选项标签渲染"},{"url":"#自定义弹出层样式","title":"自定义弹出层样式"},{"url":"#获取选项的其他属性","title":"获取选项的其他属性"},{"url":"#创建条目","title":"创建条目"},{"url":"#虚拟化","title":"虚拟化"},{"url":"#自定义触发器","title":"自定义触发器"},{"url":"#自定义候选项渲染","title":"自定义候选项渲染"}]},{"url":"#api-参考","title":"API 参考","items":[{"url":"#select-props","title":"Select Props"},{"url":"#option-props","title":"Option Props"},{"url":"#optgroup-props","title":"OptGroup Props"}]},{"url":"#methods","title":"Methods"},{"url":"#accessibility","title":"Accessibility","items":[{"url":"#aria","title":"ARIA"},{"url":"#键盘和焦点","title":"键盘和焦点"}]},{"url":"#文案规范","title":"文案规范"},{"url":"#设计变量","title":"设计变量"},{"url":"#typescript-泛型支持","title":"TypeScript 泛型支持"},{"url":"#faq","title":"FAQ"},{"url":"#相关物料","title":"相关物料"}]},"body":"var _excluded = [\"components\"];\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nfunction _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }\nfunction _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }\n/* @jsxRuntime classic */\n/* @jsx mdx */\n\nvar _frontmatter = {\n  \"localeCode\": \"zh-CN\",\n  \"order\": 46,\n  \"category\": \"输入类\",\n  \"title\": \"Select 选择器\",\n  \"icon\": \"doc-select\",\n  \"width\": \"60%\",\n  \"brief\": \"用户可以通过 Select 选择器从一个选项集合中去选中一个或多个选项，并呈现最终选择结果\"\n};\nvar makeShortcode = function makeShortcode(name) {\n  return function MDXDefaultShortcode(props) {\n    console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n    return mdx(\"div\", props);\n  };\n};\nvar Notice = makeShortcode(\"Notice\");\nvar DesignToken = makeShortcode(\"DesignToken\");\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n    props = _objectWithoutProperties(_ref, _excluded);\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u4EE3\\u7801\\u6F14\\u793A\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u5982\\u4F55\\u5F15\\u5165\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"import\",\n    \"import\": true\n  }, \"import { Select } from '@douyinfe/semi-ui';\\nconst Option = Select.Option;\\n\")), mdx(Notice, {\n    title: \"\\u6CE8\\u610F\",\n    mdxType: \"Notice\"\n  }, \"Select\\u7684\\u76F4\\u63A5\\u5B50\\u5143\\u7D20\\u5FC5\\u987B\\u4E3A Option \\u6216\\u8005 OptGroup\\uFF0C\\u4E0D\\u5141\\u8BB8\\u4E3A\\u5176\\u4ED6Element\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u57FA\\u672C\\u4F7F\\u7528\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u6BCF\\u4E2A Option \\u6807\\u7B7E\\u90FD\\u5FC5\\u987B\\u58F0\\u660E value \\u5C5E\\u6027\\uFF0COption \\u7684 children \\u6216 label \\u5C06\\u4F1A\\u88AB\\u6E32\\u67D3\\u81F3\\u4E0B\\u62C9\\u5217\\u8868\\u4E2D\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <>\\n        <Select defaultValue=\\\"douyin\\\" style={{ width: 120 }}>\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\" disabled>\\n                \\u526A\\u6620\\n            </Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select defaultValue=\\\"douyin\\\" disabled style={{ width: 120 }}>\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select placeholder=\\\"\\u8BF7\\u9009\\u62E9\\u4E1A\\u52A1\\u7EBF\\\" style={{ width: 120 }}>\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\" disabled>\\n                \\u526A\\u6620\\n            </Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n    </>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u4EE5\\u6570\\u7EC4\\u5F62\\u5F0F\\u4F20\\u5165 Option\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u53EF\\u4EE5\\u76F4\\u63A5\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"optionList\"), \"\\u4F20\\u5165\\u4E00\\u4E2A\\u5BF9\\u8C61\\u6570\\u7EC4\\uFF0C\\u6BCF\\u4E2A\\u5BF9\\u8C61\\u5FC5\\u987B\\u5305\\u542B value/label \\u5C5E\\u6027\\uFF08\\u5F53\\u7136\\u5176\\u4ED6\\u5C5E\\u6027\\u4E5F\\u53EF\\u4EE5\\u901A\\u8FC7\\u6B64\\u65B9\\u5F0F\\u4F20\\u5165\\uFF09\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const list = [\\n        { value: 'douyin', label: '\\u6296\\u97F3', otherKey: 0 },\\n        { value: 'ulikecam', label: '\\u8F7B\\u989C\\u76F8\\u673A', disabled: true, otherKey: 1 },\\n        { value: 'jianying', label: '\\u526A\\u6620', otherKey: 2 },\\n        { value: 'toutiao', label: '\\u4ECA\\u65E5\\u5934\\u6761', otherKey: 3 },\\n    ];\\n    return <Select placeholder=\\\"\\u8BF7\\u9009\\u62E9\\u4E1A\\u52A1\\u7EBF\\\" style={{ width: 180 }} optionList={list}></Select>;\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u591A\\u9009\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u81EA v2.28\\u540E\\uFF0Cselect \\u7684\\u9009\\u62E9\\u5668\\u4F1A\\u81EA\\u5E26 maxHeight 270\\uFF0C\\u5185\\u5BB9\\u8D85\\u51FA\\u540E\\u53EF\\u4EE5\\u901A\\u8FC7\\u5782\\u76F4\\u6EDA\\u52A8\\u67E5\\u770B\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u914D\\u7F6E\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"multiple\"), \"\\u5C5E\\u6027\\uFF0C\\u53EF\\u4EE5\\u652F\\u6301\\u591A\\u9009\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u914D\\u7F6E \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"maxTagCount\"), \" \\u53EF\\u4EE5\\u9650\\u5236\\u5DF2\\u9009\\u9879\\u5C55\\u793A\\u7684\\u6570\\u91CF\\uFF0C\\u8D85\\u51FA\\u90E8\\u5206\\u5C06\\u4EE5+N \\u7684\\u65B9\\u5F0F\\u5C55\\u793A\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u914D\\u7F6E \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"ellipsisTrigger\"), \" (>= v2.28.0) \\u5BF9\\u6EA2\\u51FA\\u90E8\\u5206\\u7684 tag \\u505A\\u81EA\\u9002\\u5E94\\u5904\\u7406\\uFF0C\\u5F53\\u5BBD\\u5EA6\\u4E0D\\u8DB3\\u65F6\\uFF0C\\u6700\\u540E\\u4E00\\u4E2Atag\\u5185\\u5BB9\\u4F5C\\u622A\\u65AD\\u5904\\u7406\\u3002\\u5F00\\u542F\\u8BE5\\u529F\\u80FD\\u540E\\u4F1A\\u6709\\u4E00\\u5B9A\\u6027\\u80FD\\u635F\\u8017\\uFF0C\\u4E0D\\u63A8\\u8350\\u5728\\u5927\\u8868\\u5355\\u573A\\u666F\\u4E0B\\u4F7F\\u7528\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u914D\\u7F6E \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"expandRestTagsOnClick\"), \" (>= v2.28.0) \\u53EF\\u4EE5\\u5728\\u8BBE\\u7F6E \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"maxTagCount\"), \" \\u60C5\\u51B5\\u4E0B\\u901A\\u8FC7\\u70B9\\u51FB\\u5C55\\u793A\\u5168\\u5269\\u4F59\\u7684tag\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"showRestTagsPopover\"), \" (>= v2.22.0) \\u53EF\\u4EE5\\u8BBE\\u7F6E\\u5728\\u8D85\\u51FA \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"maxTagCount\"), \" \\u540E\\uFF0Chover +N \\u662F\\u5426\\u663E\\u793A Popover\\uFF0C\\u9ED8\\u8BA4\\u4E3A \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"false\"), \"\\u3002\\u5E76\\u4E14\\uFF0C\\u8FD8\\u53EF\\u4EE5\\u5728 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"restTagsPopoverProps\"), \" \\u5C5E\\u6027\\u4E2D\\u914D\\u7F6E Popover\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u914D\\u7F6E \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"max\"), \" \\u5C5E\\u6027\\u53EF\\u9650\\u5236\\u6700\\u5927\\u53EF\\u9009\\u7684\\u6570\\u91CF\\uFF0C\\u8D85\\u51FA\\u6700\\u5927\\u9650\\u5236\\u6570\\u91CF\\u540E\\u65E0\\u6CD5\\u9009\\u4E2D\\uFF0C\\u540C\\u65F6\\u4F1A\\u89E6\\u53D1\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"onExceed\"), \"\\u56DE\\u8C03\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <>\\n        <Select multiple style={{ width: '320px' }} defaultValue={['douyin', 'ulikecam']}>\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select\\n            multiple\\n            maxTagCount={2}\\n            showRestTagsPopover={true}\\n            restTagsPopoverProps={{ position: 'top' }}\\n            style={{ width: '320px' }}\\n            defaultValue={['douyin', 'ulikecam', 'jianying']}\\n        >\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n        \\n        <br />\\n        <br />\\n        <Select\\n            multiple\\n            style={{ width: '320px' }}\\n            defaultValue={['douyin']}\\n            max={2}\\n            onExceed={() => Toast.warning('\\u6700\\u591A\\u53EA\\u5141\\u8BB8\\u9009\\u62E9\\u4E24\\u9879')}\\n        >\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select\\n            multiple\\n            maxTagCount={2}\\n            showRestTagsPopover={true}\\n            restTagsPopoverProps={{ position: 'top' }}\\n            style={{ width: '220px' }}\\n            defaultValue={['xigua', 'ulikecam', 'jianying', 'douyin']}\\n            ellipsisTrigger\\n            expandRestTagsOnClick\\n        >\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n    </>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u5206\\u7EC4\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u7528 OptGroup \\u8FDB\\u884C\\u5206\\u7EC4\\uFF08\\u5206\\u7EC4\\u529F\\u80FD\\u4EC5\\u652F\\u6301\\u901A\\u8FC7 jsx \\u65B9\\u5F0F\\u58F0\\u660E children \\u4F7F\\u7528\\uFF0C\\u4E0D\\u652F\\u6301 optionList \\u65B9\\u5F0F\\u4F20\\u5165\\uFF09\"), mdx(Notice, {\n    title: \"\\u6CE8\\u610F\",\n    mdxType: \"Notice\"\n  }, \"1. OptGroup\\u5FC5\\u987B\\u4E3ASelect\\u7684\\u76F4\\u63A5\\u5B50\\u5143\\u7D20\\uFF0C\\u4E0D\\u5141\\u8BB8\\u6709Fragment\\u6216DIV\\u7B49\\u5176\\u4ED6\\u5143\\u7D20\\u963B\\u9694 \", mdx(\"br\", null), \"2. \\u82E5Select\\u7684children\\u9700\\u8981\\u52A8\\u6001\\u66F4\\u65B0\\uFF0COptGroup\\u4E0A\\u7684key\\u4E5F\\u9700\\u8981\\u8FDB\\u884C\\u66F4\\u65B0\\uFF0C\\u5426\\u5219Select\\u65E0\\u6CD5\\u8BC6\\u522B\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <Select placeholder=\\\"\\\" style={{ width: 180 }} filter>\\n        <Select.OptGroup label=\\\"Asia\\\">\\n            <Select.Option value=\\\"a-1\\\">China</Select.Option>\\n            <Select.Option value=\\\"a-2\\\">Korea</Select.Option>\\n        </Select.OptGroup>\\n        <Select.OptGroup label=\\\"Europe\\\">\\n            <Select.Option value=\\\"b-1\\\">Germany</Select.Option>\\n            <Select.Option value=\\\"b-2\\\">France</Select.Option>\\n        </Select.OptGroup>\\n        <Select.OptGroup label=\\\"South America\\\">\\n            <Select.Option value=\\\"c-1\\\">Peru</Select.Option>\\n        </Select.OptGroup>\\n    </Select>\\n);\\n\")), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const data = [\\n        {\\n            label: 'Asia',\\n            children: [\\n                { value: 'a-1', label: 'China' },\\n                { value: 'a-2', label: 'Korea' },\\n            ],\\n        },\\n        {\\n            label: 'Europe',\\n            children: [\\n                { value: 'b-1', label: 'Germany' },\\n                { value: 'b-2', label: 'France' },\\n            ],\\n        },\\n        {\\n            label: 'South America',\\n            children: [{ value: 'c-1', label: 'Peru' }],\\n        },\\n    ];\\n    return (\\n        <Select placeholder=\\\"\\\" style={{ width: 180 }} filter>\\n            {data.map((group, index) => (\\n                <Select.OptGroup label={group.label} key={`${index}-${group.label}`}>\\n                    {group.children.map((option, index2) => (\\n                        <Select.Option value={option.value} key={`${index2}-${group.label}`}>\\n                            {option.label}\\n                        </Select.Option>\\n                    ))}\\n                </Select.OptGroup>\\n            ))}\\n        </Select>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u4E0D\\u540C\\u5C3A\\u5BF8\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u901A\\u8FC7 Size \\u63A7\\u5236\\u9009\\u62E9\\u5668\\u7684\\u5927\\u5C0F\\u5C3A\\u5BF8: \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"small\"), \" / \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"default\"), \" / \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"large\")), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <>\\n        <Select placeholder=\\\"\\u8BF7\\u9009\\u62E9\\u4E1A\\u52A1\\u7EBF\\\" style={{ width: '180px' }} size=\\\"small\\\">\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select placeholder=\\\"\\u8BF7\\u9009\\u62E9\\u4E1A\\u52A1\\u7EBF\\\" style={{ width: '180px' }}>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select placeholder=\\\"\\u8BF7\\u9009\\u62E9\\u4E1A\\u52A1\\u7EBF\\\" style={{ width: '180px' }} size=\\\"large\\\">\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        </Select>\\n    </>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u4E0D\\u540C\\u6821\\u9A8C\\u72B6\\u6001\\u6837\\u5F0F\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"validateStatus: default / warning / error\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u4EC5\\u5F71\\u54CD\\u80CC\\u666F\\u989C\\u8272\\u7B49\\u6837\\u5F0F\\u8868\\u73B0\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <>\\n        <Select style={{ width: '180px' }}>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select style={{ width: '180px' }} validateStatus=\\\"warning\\\">\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select style={{ width: '180px' }} validateStatus=\\\"error\\\">\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        </Select>\\n    </>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u914D\\u7F6E\\u524D\\u7F00\\u3001\\u540E\\u7F00\\u3001\\u6E05\\u9664\\u6309\\u94AE\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u53EF\\u4EE5\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"prefix\"), \"\\u4F20\\u5165\\u9009\\u62E9\\u6846\\u524D\\u7F00\\uFF0C\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"suffix\"), \"\\u4F20\\u5165\\u9009\\u62E9\\u6846\\u540E\\u7F00\\uFF0C\\u53EF\\u4EE5\\u4E3A\\u6587\\u672C\\u6216\\u8005 ReactNode\", mdx(\"br\", {\n    parentName: \"li\"\n  }), \"\\u5F53 prefix\\u3001suffix \\u4F20\\u5165\\u7684\\u5185\\u5BB9\\u4E3A\\u6587\\u672C\\u6216\\u8005 Icon \\u65F6\\uFF0C\\u4F1A\\u81EA\\u52A8\\u5E26\\u4E0A\\u5DE6\\u53F3\\u95F4\\u9694\\uFF0C\\u82E5\\u4E3A\\u81EA\\u5B9A\\u4E49 ReactNode\\uFF0C\\u5219\\u5DE6\\u53F3\\u95F4\\u9694\\u4E3A 0\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"showClear\"), \"\\u63A7\\u5236\\u6E05\\u9664\\u6309\\u94AE\\u662F\\u5426\\u5C55\\u793A\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"showArrow\"), \"\\u63A7\\u5236\\u53F3\\u4FA7\\u4E0B\\u62C9\\u7BAD\\u5934\\u662F\\u5426\\u5C55\\u793A\")), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\nimport { IconVigoLogo, IconGift } from '@douyinfe/semi-icons';\\n\\n() => (\\n    <>\\n        <Select style={{ width: '320px' }} defaultValue={'ulikecam'} prefix={<IconVigoLogo />} showClear={true}>\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select\\n            style={{ width: '320px' }}\\n            defaultValue={'ulikecam'}\\n            prefix={<IconVigoLogo />}\\n            suffix={<IconGift />}\\n            showArrow={false}\\n        >\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n    </>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u5728\\u9876\\u90E8/\\u5E95\\u90E8\\u6E32\\u67D3\\u9644\\u52A0\\u9879\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u6211\\u4EEC\\u5728\\u5F39\\u51FA\\u5C42\\u9876\\u90E8\\u3001\\u5E95\\u90E8\\u5206\\u522B\\u9884\\u7559\\u4E86\\u63D2\\u69FD\\uFF0C\\u5F53\\u4F60\\u9700\\u8981\\u5728\\u5F39\\u51FA\\u5C42\\u4E2D\\u6DFB\\u52A0\\u81EA\\u5B9A\\u4E49 node \\u65F6\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u53EF\\u4EE5\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"innerBottomSlot\"), \"\\u6216\\u8005\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"outerBottomSlot\"), \"\\u4F20\\u5165\\uFF0C\\u81EA\\u5B9A\\u4E49 node \\u5C06\\u4F1A\\u88AB\\u6E32\\u67D3\\u5728\\u5F39\\u51FA\\u5C42\\u5E95\\u90E8\\uFF1B\\u53EF\\u4EE5\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"innerTopSlot\"), \"\\u6216\\u8005\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"outerTopSlot\"), \"\\u4F20\\u5165\\uFF0C\\u81EA\\u5B9A\\u4E49 node \\u5C06\\u4F1A\\u88AB\\u6E32\\u67D3\\u5728\\u5F39\\u51FA\\u5C42\\u9876\\u90E8\\u3002\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"innerTopSlot\"), \" \\u548C \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"innerBottomSlot\"), \"\\u5C06\\u4F1A\\u88AB\\u6E32\\u67D3\\u5728 optionList \\u5185\\u90E8\\uFF0C\\u5F53\\u6EDA\\u52A8\\u5230 optionList \\u9876\\u90E8/\\u5E95\\u90E8\\u65F6\\u5C55\\u73B0\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"outerTopSlot\"), \" \\u548C \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"outerBottomSlot\"), \"\\u5C06\\u4F1A\\u88AB\\u6E32\\u67D3\\u4E3A\\u4E0E optionList \\u5E73\\u7EA7\\uFF0C\\u65E0\\u8BBA optionList \\u662F\\u5426\\u6EDA\\u52A8\\uFF0C\\u90FD\\u4F1A\\u59CB\\u7EC8\\u5C55\\u73B0\")), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    let innerSlotStyle = {\\n        backgroundColor: 'var(--color-white)',\\n        height: '36px',\\n        display: 'flex',\\n        alignItems: 'center',\\n        cursor: 'pointer',\\n        paddingLeft: 32,\\n        borderTop: '1px solid var(--semi-color-border)',\\n        borderRadius: '0 0 6px 6px',\\n        color: 'var(--semi-color-link)',\\n    };\\n    let innerSlotNode = <div style={innerSlotStyle}>\\u70B9\\u51FB\\u52A0\\u8F7D\\u66F4\\u591A</div>;\\n    let outSlotStyle = {\\n        backgroundColor: 'var(--semi-color-fill-0)',\\n        height: '36px',\\n        display: 'flex',\\n        paddingLeft: 32,\\n        color: 'var(--semi-color-link)',\\n        alignItems: 'center',\\n        cursor: 'pointer',\\n        borderTop: '1px solid var(--semi-color-border)',\\n        borderRadius: '0 0 6px 6px',\\n    };\\n    let outSlotNode = (\\n        <div style={outSlotStyle}>\\n            <span style={{ color: 'var(--semi-color-link)' }}>\\u672A\\u627E\\u5230\\u5E94\\u7528?</span>\\n        </div>\\n    );\\n\\n    return (\\n        <div>\\n            <p>outerBottomSlot:</p>\\n            <Select\\n                style={{ width: 300 }}\\n                dropdownStyle={{ width: 180 }}\\n                maxHeight={150}\\n                outerBottomSlot={outSlotNode}\\n                placeholder=\\\"\\u81EA\\u5B9A\\u4E49\\u5916\\u4FA7\\u5E95\\u90E8slot\\uFF0C\\u59CB\\u7EC8\\u663E\\u793A\\\"\\n                defaultOpen\\n                autoAdjustOverflow={false}\\n                position=\\\"bottom\\\"\\n            >\\n                <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n                <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n                <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n                <Select.Option value=\\\"duoshan\\\">\\u591A\\u95EA</Select.Option>\\n                <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n            </Select>\\n            <p style={{ marginTop: 200 }}>innerBottomSlot:</p>\\n            <Select\\n                style={{ width: 300 }}\\n                dropdownStyle={{ width: 180 }}\\n                maxHeight={150}\\n                innerBottomSlot={innerSlotNode}\\n                placeholder=\\\"\\u81EA\\u5B9A\\u4E49\\u5185\\u4FA7\\u5E95\\u90E8slot\\uFF0C\\u6EDA\\u52A8\\u81F3\\u5E95\\u90E8\\u663E\\u793A\\\"\\n            >\\n                <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n                <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n                <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n                <Select.Option value=\\\"duoshan\\\">\\u591A\\u95EA</Select.Option>\\n                <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n            </Select>\\n        </div>\\n    );\\n};\\n\")), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u901A\\u8FC7 outerTopSlot \\u5C06\\u5185\\u5BB9\\u63D2\\u5165\\u9876\\u90E8\\u63D2\\u69FD\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const list = {\\n        component: [\\n            { value: 'select', label: '\\u9009\\u62E9\\u5668' },\\n            { value: 'tabs', label: '\\u6807\\u7B7E' },\\n            { value: 'avatar', label: '\\u5934\\u50CF' },\\n            { value: 'button', label: '\\u6309\\u94AE' },\\n        ],\\n        design: [\\n            { value: 'color', label: '\\u989C\\u8272' },\\n            { value: 'dark', label: '\\u6697\\u8272\\u6A21\\u5F0F' },\\n            { value: 'icon', label: '\\u56FE\\u6807' },\\n            { value: 'font', label: '\\u5B57\\u4F53' },\\n        ],\\n        feedback: [\\n            { value: 'faq', label: '\\u5E38\\u89C1\\u95EE\\u9898' },\\n            { value: 'join', label: '\\u52A0\\u5165\\u7528\\u6237\\u7FA4' },\\n            { value: 'hornbill', label: '\\u7280\\u9E1F\\u53CD\\u9988\\u95EE\\u9898' },\\n        ],\\n    };\\n\\n    const [key, setKey] = useState('component');\\n    const [value, setValue] = useState({ value: 'faq', label: '\\u5E38\\u89C1\\u95EE\\u9898' });\\n    const handleTdouyinlick = itemKey => {\\n        setKey(itemKey);\\n    };\\n\\n    const tabStyle = {\\n        cursor: 'pointer',\\n        marginRight: 12,\\n        paddingBottom: 4,\\n    };\\n    const tabActiveStyle = {\\n        ...tabStyle,\\n        borderBottom: '1px solid var(--semi-color-primary)',\\n        fontWeight: 700,\\n    };\\n    const tabWrapper = {\\n        display: 'flex',\\n        paddingTop: 8,\\n        paddingLeft: 32,\\n        borderBottom: '0.5px solid var(--semi-color-border)',\\n    };\\n    const tabOptions = [\\n        { itemKey: 'component', label: '\\u7EC4\\u4EF6' },\\n        { itemKey: 'design', label: '\\u8BBE\\u8BA1' },\\n        { itemKey: 'feedback', label: '\\u53CD\\u9988' },\\n    ];\\n\\n    const outerTopSlotNode = (\\n        <div style={tabWrapper}>\\n            {tabOptions.map((item, index) => {\\n                style = item.itemKey === key ? tabActiveStyle : tabStyle;\\n                return (\\n                    <div style={style} key={item.itemKey} onClick={() => handleTdouyinlick(item.itemKey)}>\\n                        {item.label}\\n                    </div>\\n                );\\n            })}\\n        </div>\\n    );\\n    return (\\n        <Select\\n            defaultOpen\\n            autoAdjustOverflow={false}\\n            value={value}\\n            onChangeWithObject\\n            onChange={obj => setValue(obj)}\\n            style={{ width: 200 }}\\n            outerTopSlot={outerTopSlotNode}\\n            optionList={list[key]}\\n        />\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u53D7\\u63A7\\u7EC4\\u4EF6\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4F20\\u5165 value \\u65F6 Select \\u4E3A\\u53D7\\u63A7\\u7EC4\\u4EF6\\uFF0C\\u6240\\u9009\\u4E2D\\u7684\\u503C\\u5B8C\\u5168\\u7531 value \\u51B3\\u5B9A\\u3002\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React, { useState } from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    let [value, setValue] = useState('xigua');\\n    return (\\n        <>\\n            <Select value={value} style={{ width: '300px' }} onChange={setValue} placeholder=\\\"\\u53D7\\u63A7\\u7684Select\\\">\\n                <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n                <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n                <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n                <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n            </Select>\\n        </>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u52A8\\u6001\\u4FEE\\u6539 Options\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5982\\u679C\\u9700\\u8981\\u52A8\\u6001\\u66F4\\u65B0 Options\\uFF0C\\u5E94\\u8BE5\\u4F7F\\u7528\\u53D7\\u63A7\\u7684 value\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React, { useState } from 'react';\\nimport { Select, Button } from '@douyinfe/semi-ui';\\n\\n() => {\\n    let [options, setOptions] = useState([1, 2, 3, 4]);\\n    function add() {\\n        let length = Math.ceil(Math.random() * 10);\\n        let newOptions = Array.from({ length }, (v, i) => i + 1);\\n        setOptions(newOptions);\\n    }\\n    return (\\n        <>\\n            <Select style={{ width: '180px' }} placeholder=\\\"\\u8BF7\\u9009\\u62E9\\\" value={4}>\\n                {options.map(option => (\\n                    <Select.Option value={option} key={option}>\\n                        {option}\\n                    </Select.Option>\\n                ))}\\n            </Select>\\n            <br />\\n            <br />\\n            <Button onClick={add}>changeOptions Dynamic</Button>\\n        </>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u8054\\u52A8\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4F7F\\u7528\\u53D7\\u63A7 value\\uFF0C\\u5B9E\\u73B0\\u4E0D\\u540C Select \\u4E4B\\u95F4\\u7684\\u8054\\u52A8\\u3002\\u5982\\u679C\\u662F\\u5E26\\u6709\\u5C42\\u7EA7\\u5173\\u7CFB\\u7684\\u590D\\u6742\\u8054\\u52A8\\u5EFA\\u8BAE\\u76F4\\u63A5\\u4F7F\\u7528\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Cascader\"), \"\\u7EC4\\u4EF6\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React, { useState } from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const provinces = ['\\u56DB\\u5DDD', '\\u5E7F\\u4E1C'];\\n    const maps = {\\n        \\u56DB\\u5DDD: ['\\u6210\\u90FD', '\\u90FD\\u6C5F\\u5830'],\\n        \\u5E7F\\u4E1C: ['\\u5E7F\\u5DDE', '\\u6DF1\\u5733', '\\u4E1C\\u839E'],\\n    };\\n\\n    const [province, setProvince] = useState(provinces[0]);\\n    const citys = maps[province];\\n    const [city, setCity] = useState(citys[0]);\\n\\n    const provinceChange = newProvince => {\\n        setProvince(newProvince);\\n        setCity(maps[newProvince][0]);\\n    };\\n    const cityChange = newCity => setCity(newCity);\\n\\n    return (\\n        <>\\n            <Select style={{ width: '150px', margin: '10px' }} onChange={provinceChange} value={province}>\\n                {provinces.map(pro => (\\n                    <Select.Option value={pro} key={pro}>\\n                        {pro}\\n                    </Select.Option>\\n                ))}\\n            </Select>\\n            <Select style={{ width: '150px', margin: '10px' }} value={city} onChange={cityChange}>\\n                {citys.map(c => (\\n                    <Select.Option value={c} key={c}>\\n                        {c}\\n                    </Select.Option>\\n                ))}\\n            </Select>\\n        </>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u5F00\\u542F\\u641C\\u7D22\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5C06 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"filter\"), \" \\u7F6E\\u4E3A true\\uFF0C\\u5F00\\u542F\\u641C\\u7D22\\u80FD\\u529B\\u3002\\u9ED8\\u8BA4\\u641C\\u7D22\\u7B56\\u7565\\u5C06\\u4E3A input \\u8F93\\u5165\\u503C\\u4E0E option \\u7684 label \\u503C\\u8FDB\\u884C include \\u5BF9\\u6BD4\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u9ED8\\u8BA4\\u60C5\\u51B5\\u4E0B\\uFF0C\\u591A\\u9009\\u9009\\u4E2D\\u540E\\u4F1A\\u81EA\\u52A8\\u6E05\\u7A7A\\u641C\\u7D22\\u5173\\u952E\\u5B57\\u3002\\u82E5\\u4F60\\u5E0C\\u671B\\u4FDD\\u7559\\uFF0C\\u53EF\\u4EE5\\u901A\\u8FC7 autoClearSearchValue \\u8BBE\\u4E3A false \\u5173\\u95ED\\u9ED8\\u8BA4\\u884C\\u4E3A\\uFF08v2.3 \\u540E\\u63D0\\u4F9B\\uFF09\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <>\\n        <Select filter style={{ width: 180 }} placeholder=\\\"\\u5E26\\u641C\\u7D22\\u529F\\u80FD\\u7684\\u5355\\u9009\\\">\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select filter multiple style={{ width: 300 }} placeholder=\\\"\\u5E26\\u641C\\u7D22\\u529F\\u80FD\\u7684\\u591A\\u9009\\\" autoClearSearchValue={false}>\\n            <Select.Option value=\\\"semi-0\\\">Semi-0</Select.Option>\\n            <Select.Option value=\\\"semi-1\\\">Semi-1</Select.Option>\\n            <Select.Option value=\\\"semi-2\\\">Semi-2</Select.Option>\\n            <Select.Option value=\\\"semi-3\\\">Semi-3</Select.Option>\\n            <Select.Option value=\\\"semi-4\\\">Semi-4</Select.Option>\\n        </Select>\\n    </>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u641C\\u7D22\\u6846\\u4F4D\\u7F6E\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u9ED8\\u8BA4\\u641C\\u7D22\\u6846\\u5C55\\u793A\\u4E8E Select \\u7684 Trigger \\u89E6\\u53D1\\u5668\\u4E0A\\u3002\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"searchPosition\"), \" \\u53EF\\u4EE5\\u6307\\u5B9A\\u4E0D\\u540C\\u7684\\u4F4D\\u7F6E\\uFF0C\\u53EF\\u9009 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"dropdown\"), \"\\u3001\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"trigger\"), \"\\u3002 \\u5728 v2.61.0\\u540E\\u63D0\\u4F9B\\n\\u82E5\\u5E0C\\u671B\\u5B9A\\u5236\\u4F4D\\u4E8E dropdown \\u4E2D\\u7684 Input \\u641C\\u7D22\\u6846\\u7684 placeholder\\uFF0C\\u53EF\\u4EE5\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"searchPlaceholder\"), \" \\u63A7\\u5236\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u82E5 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"searchPosition\"), \" \\u503C\\u4E3A \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"trigger\"), \"\\uFF0C\\u5F53showClear=true \\u65F6\\uFF0C\\u70B9\\u51FBTrigger\\u533A\\u57DF\\u7684\\u6E05\\u7A7A\\u6309\\u94AE\\uFF0C\\u5C06\\u540C\\u65F6\\u6E05\\u7A7A\\u5DF2\\u9009\\u9879\\u4EE5\\u53CA\\u641C\\u7D22\\u6846\\u4E2D\\u7684\\u6587\\u672C\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u82E5 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"searchPosition\"), \" \\u503C\\u4E3A \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"dropdown\"), \"\\uFF0C\\u5F53showClear=true \\u65F6\\uFF0C\\u70B9\\u51FBTrigger\\u533A\\u57DF\\u6E05\\u7A7A\\u6309\\u94AE\\uFF0C\\u4EC5\\u6E05\\u7A7A\\u5DF2\\u9009\\u9879\\u3002\\u70B9\\u51FB\\u641C\\u7D22\\u6846\\u4E2D\\u7684\\u6E05\\u7A7A\\u6309\\u94AE\\uFF0C\\u4EC5\\u6E05\\u7A7A\\u641C\\u7D22\\u6587\\u672C  \"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <>\\n        <Select\\n            filter\\n            searchPosition='dropdown'\\n            style={{ width: 200 }}\\n            defaultValue={'ulikecam'}\\n            placeholder='\\u6211\\u7684\\u641C\\u7D22\\u6846\\u5728\\u4E0B\\u62C9\\u83DC\\u5355\\u4E2D'\\n            searchPlaceholder=\\\"\\u5E26\\u641C\\u7D22\\u529F\\u80FD\\u7684\\u5355\\u9009\\\"\\n        >\\n            <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n        </Select>\\n        <br />\\n        <br />\\n        <Select\\n            filter\\n            searchPosition='dropdown'\\n            multiple\\n            style={{ width: 300 }}\\n            defaultValue={['semi-1']}\\n            placeholder='\\u6211\\u7684\\u641C\\u7D22\\u6846\\u5728\\u4E0B\\u62C9\\u83DC\\u5355\\u4E2D'\\n            searchPlaceholder=\\\"\\u5E26\\u641C\\u7D22\\u529F\\u80FD\\u7684\\u591A\\u9009\\\"\\n            autoClearSearchValue={false}\\n        >\\n            <Select.Option value=\\\"semi-0\\\">Semi-0</Select.Option>\\n            <Select.Option value=\\\"semi-1\\\">Semi-1</Select.Option>\\n            <Select.Option value=\\\"semi-2\\\">Semi-2</Select.Option>\\n            <Select.Option value=\\\"semi-3\\\">Semi-3</Select.Option>\\n            <Select.Option value=\\\"semi-4\\\">Semi-4</Select.Option>\\n        </Select>\\n    </>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u8FDC\\u7A0B\\u641C\\u7D22\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5E26\\u6709\\u8FDC\\u7A0B\\u641C\\u7D22\\uFF0C\\u9632\\u6296\\u8BF7\\u6C42\\uFF0C\\u52A0\\u8F7D\\u72B6\\u6001\\u7684\\u591A\\u9009\\u793A\\u4F8B\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u901A\\u8FC7\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"filter\"), \"\\u5F00\\u542F\\u641C\\u7D22\\u80FD\\u529B\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u5C06\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"remote\"), \"\\u8BBE\\u7F6E\\u4E3A true \\u5173\\u95ED\\u5BF9\\u5F53\\u524D\\u6570\\u636E\\u7684\\u7B5B\\u9009\\u8FC7\\u6EE4\\n\\u901A\\u8FC7\\u52A8\\u6001\\u66F4\\u65B0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"optionList\"), \"\\u66F4\\u65B0\\u4E0B\\u62C9\\u83DC\\u5355\\u4E2D\\u7684\\u5907\\u9009\\u9879\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u4F7F\\u7528\\u53D7\\u63A7\\u7684 value \\u5C5E\\u6027\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { debounce } from 'lodash-es';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [loading, setLoading] = useState(false);\\n    const optionList = [\\n        { value: 'douyin', label: '\\u6296\\u97F3', type: 1 },\\n        { value: 'xingtu', label: '\\u9192\\u56FE', type: 2 },\\n        { value: 'jianying', label: '\\u526A\\u6620', type: 3 },\\n        { value: 'toutiao', label: '\\u4ECA\\u65E5\\u5934\\u6761', type: 4 },\\n    ];\\n    const [list, setList] = useState(optionList);\\n    const [value, setValue] = useState('');\\n\\n    const handleMultipleChange = newValue => {\\n        setValue(newValue);\\n    };\\n\\n    const handleSearch = inputValue => {\\n        setLoading(true);\\n        let result = [];\\n        if (inputValue) {\\n            let length = Math.ceil(Math.random() * 100);\\n            result = Array.from({ length }, (v, i) => {\\n                return { value: inputValue + i, label: `\\u76F8\\u8FD1\\u4E1A\\u52A1 ${inputValue}${i}`, type: i + 1 };\\n            });\\n            setTimeout(() => {\\n                setLoading(false);\\n                setList(result);\\n            }, 1000);\\n        } else {\\n            setLoading(false);\\n        }\\n    };\\n\\n    return (\\n        <Select\\n            style={{ width: 300 }}\\n            filter\\n            remote\\n            onChangeWithObject\\n            multiple\\n            value={value}\\n            onSearch={debounce(handleSearch, 1000)}\\n            optionList={list}\\n            loading={loading}\\n            onChange={handleMultipleChange}\\n            emptyContent={null}\\n        ></Select>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u81EA\\u5B9A\\u4E49\\u641C\\u7D22\\u903B\\u8F91\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u53EF\\u4EE5\\u5C06 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"filter\"), \" \\u7F6E\\u4E3A\\u81EA\\u5B9A\\u4E49\\u51FD\\u6570\\uFF0C\\u5B9A\\u5236\\u4F60\\u60F3\\u8981\\u7684\\u641C\\u7D22\\u7B56\\u7565\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u5982\\u4E0B\\u4F8B\\u5B50\\uFF0C\\u9009\\u9879 label \\u503C\\u90FD\\u662F\\u5927\\u5199\\uFF0C\\u9ED8\\u8BA4\\u7684\\u68C0\\u7D22\\u7B56\\u7565\\u662F\\u5B57\\u7B26\\u4E32 include \\u5BF9\\u6BD4\\uFF0C\\u4F1A\\u533A\\u5206\\u5927\\u5C0F\\u5199\\u3002\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u901A\\u8FC7\\u4F20\\u5165\\u81EA\\u5B9A\\u4E49 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"filter\"), \" \\u51FD\\u6570\\uFF0C\\u68C0\\u7D22\\u65F6\\u8F93\\u5165\\u5C0F\\u5199\\u5B57\\u6BCD\\u4E5F\\u80FD\\u641C\\u5230\\u76F8\\u5E94\\u5185\\u5BB9\\u3002\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    function searchLabel(sugInput, option) {\\n        let label = option.label.toUpperCase();\\n        let sug = sugInput.toUpperCase();\\n        return label.includes(sug);\\n    }\\n    return (\\n        <Select filter={searchLabel} style={{ width: '180px' }} placeholder=\\\"try douyin\\\">\\n            <Select.Option value=\\\"douyin\\\">douyin</Select.Option>\\n            <Select.Option value=\\\"ulikecam\\\">HOTSOON</Select.Option>\\n            <Select.Option value=\\\"jianying\\\">PIPIXIA</Select.Option>\\n            <Select.Option value=\\\"xigua\\\">XIGUA</Select.Option>\\n        </Select>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u81EA\\u5B9A\\u4E49\\u5DF2\\u9009\\u9879\\u6807\\u7B7E\\u6E32\\u67D3\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u9ED8\\u8BA4\\u60C5\\u51B5\\u4E0B\\uFF0C\\u9009\\u4E2D\\u9009\\u9879\\u540E\\u4F1A\\u5C06 option.label \\u6216 option.children \\u7684\\u5185\\u5BB9\\u56DE\\u586B\\u5230\\u9009\\u62E9\\u6846\\u4E2D\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u4F46\\u4F60\\u53EF\\u4EE5\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"renderSelectedItem\"), \" \\u81EA\\u5B9A\\u4E49\\u9009\\u62E9\\u6846\\u4E2D\\u5DF2\\u9009\\u9879\\u6807\\u7B7E\\u7684\\u6E32\\u67D3\\u7ED3\\u6784\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5355\\u9009\\u65F6 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"renderSelectedItem(optionNode:object) => content:ReactNode\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u591A\\u9009\\u65F6 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"renderSelectedItem(optionNode:object, { index:number, onClose:function }) => { isRenderInTag:bool, content:ReactNode }\"), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"isRenderInTag \\u4E3A true \\u65F6\\uFF0C\\u4F1A\\u81EA\\u52A8\\u5C06 content \\u5305\\u88F9\\u5728 Tag \\u4E2D\\u6E32\\u67D3\\uFF08\\u5E26\\u6709\\u80CC\\u666F\\u8272\\u4EE5\\u53CA\\u5173\\u95ED\\u6309\\u94AE\\uFF09\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"isRenderInTag \\u4E3A false \\u65F6\\uFF0C\\u5C06\\u76F4\\u63A5\\u6E32\\u67D3\\u8FD4\\u56DE\\u7684 content\")))), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select, Avatar, Tag } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const list = [\\n        {\\n            name: '\\u590F\\u53EF\\u6F2B',\\n            email: 'xiakeman@example.com',\\n            avatar: 'https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/dy.png',\\n        },\\n        {\\n            name: '\\u7533\\u60A6',\\n            email: 'shenyue@example.com',\\n            avatar:\\n                'https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/bag.jpeg',\\n        },\\n        {\\n            name: '\\u66F2\\u6668\\u4E00',\\n            email: 'quchenyi@example.com',\\n            avatar:\\n                'https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/Viamaker.png',\\n        },\\n        {\\n            name: '\\u6587\\u5609\\u8302',\\n            email: 'wenjiamao@example.com',\\n            avatar:\\n                'https://sf6-cdn-tos.douyinstatic.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/6fbafc2d-e3e6-4cff-a1e2-17709c680624.png',\\n        },\\n    ];\\n\\n    const renderSelectedItem = optionNode => (\\n        <div style={{ display: 'flex', alignItems: 'center' }}>\\n            <Avatar src={optionNode.avatar} size=\\\"small\\\">\\n                {optionNode.abbr}\\n            </Avatar>\\n            <span style={{ marginLeft: 8 }}>{optionNode.email}</span>\\n        </div>\\n    );\\n\\n    // avatarSrc & avatarShape are supported\\n    const renderMultipleWithCustomTag = (optionNode, { onClose }) => {\\n        const content = (\\n            <Tag avatarSrc={optionNode.avatar} avatarShape=\\\"circle\\\" closable={true} onClose={onClose} size=\\\"large\\\">\\n                {optionNode.name}\\n            </Tag>\\n        );\\n        return {\\n            isRenderInTag: false,\\n            content,\\n        };\\n    };\\n\\n    const renderMultipleWithCustomTag2 = (optionNode, { onClose }) => {\\n        const content = (\\n            <Tag avatarSrc={optionNode.avatar} avatarShape=\\\"square\\\" closable={true} onClose={onClose} size=\\\"large\\\">\\n                {optionNode.name}\\n            </Tag>\\n        );\\n        return {\\n            isRenderInTag: false,\\n            content,\\n        };\\n    };\\n\\n    const renderCustomOption = (item, index) => {\\n        const optionStyle = {\\n            display: 'flex',\\n            paddingLeft: 24,\\n            paddingTop: 10,\\n            paddingBottom: 10,\\n        };\\n        return (\\n            <Select.Option value={item.name} style={optionStyle} showTick={true} {...item} key={item.email}>\\n                <Avatar size=\\\"small\\\" src={item.avatar} />\\n                <div style={{ marginLeft: 8 }}>\\n                    <div style={{ fontSize: 14 }}>{item.name}</div>\\n                    <div\\n                        style={{ color: 'var(--color-text-2)', fontSize: 12, lineHeight: '16px', fontWeight: 'normal' }}\\n                    >\\n                        {item.email}\\n                    </div>\\n                </div>\\n            </Select.Option>\\n        );\\n    };\\n\\n    return (\\n        <>\\n            <Select\\n                placeholder=\\\"\\u8BF7\\u9009\\u62E9\\\"\\n                style={{ width: 280, height: 40 }}\\n                onChange={v => console.log(v)}\\n                defaultValue={'\\u7533\\u60A6'}\\n                renderSelectedItem={renderSelectedItem}\\n            >\\n                {list.map((item, index) => renderCustomOption(item, index))}\\n            </Select>\\n            <Select\\n                placeholder=\\\"\\u8BF7\\u9009\\u62E9\\\"\\n                maxTagCount={2}\\n                style={{ width: 280, marginTop: 20 }}\\n                onChange={v => console.log(v)}\\n                defaultValue={['\\u7533\\u60A6', '\\u66F2\\u6668\\u4E00']}\\n                multiple\\n                renderSelectedItem={renderMultipleWithCustomTag}\\n            >\\n                {list.map((item, index) => renderCustomOption(item, index))}\\n            </Select>\\n            <Select\\n                placeholder=\\\"\\u8BF7\\u9009\\u62E9\\\"\\n                maxTagCount={2}\\n                style={{ width: 280, marginTop: 20 }}\\n                onChange={v => console.log(v)}\\n                defaultValue={['\\u7533\\u60A6', '\\u66F2\\u6668\\u4E00']}\\n                multiple\\n                renderSelectedItem={renderMultipleWithCustomTag2}\\n            >\\n                {list.map((item, index) => renderCustomOption(item, index))}\\n            </Select>\\n        </>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u81EA\\u5B9A\\u4E49\\u5F39\\u51FA\\u5C42\\u6837\\u5F0F\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4F60\\u53EF\\u4EE5\\u901A\\u8FC7 dropdownClassName\\u3001dropdownStyle \\u63A7\\u5236\\u5F39\\u51FA\\u5C42\\u7684\\u6837\\u5F0F\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u4F8B\\u5982\\u5F53\\u81EA\\u5B9A\\u4E49\\u5F39\\u51FA\\u5C42\\u7684\\u5BBD\\u5EA6\\u65F6\\uFF0C\\u53EF\\u4EE5\\u901A\\u8FC7 dropdownStyle \\u4F20\\u5165 width\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => (\\n    <Select\\n        placeholder=\\\"\\u81EA\\u5B9A\\u4E49\\u5F39\\u51FA\\u5C42\\u6837\\u5F0F\\u7684\\\"\\n        style={{ width: 180 }}\\n        dropdownStyle={{ width: 250 }}\\n        dropdownClassName=\\\"test\\\"\\n    >\\n        <Select.Option value=\\\"douyin\\\">\\u6296\\u97F3</Select.Option>\\n        <Select.Option value=\\\"ulikecam\\\">\\u8F7B\\u989C\\u76F8\\u673A</Select.Option>\\n        <Select.Option value=\\\"jianying\\\">\\u526A\\u6620</Select.Option>\\n        <Select.Option value=\\\"xigua\\\">\\u897F\\u74DC\\u89C6\\u9891</Select.Option>\\n    </Select>\\n);\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u83B7\\u53D6\\u9009\\u9879\\u7684\\u5176\\u4ED6\\u5C5E\\u6027\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u9ED8\\u8BA4\\u60C5\\u51B5\\u4E0B\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"onChange\"), \"\\u53EA\\u80FD\\u62FF\\u5230 value\\uFF0C\\u5982\\u679C\\u9700\\u8981\\u62FF\\u9009\\u4E2D\\u8282\\u70B9\\u7684\\u5176\\u4ED6\\u5C5E\\u6027\\uFF0C\\u53EF\\u4EE5\\u4F7F\\u7528\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"onChangeWithObject\"), \"\\u5C5E\\u6027\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u6B64\\u65F6\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"onChange\"), \"\\u51FD\\u6570\\u7684\\u5165\\u53C2\\u5C06\\u4F1A\\u662F object\\uFF0C\\u5305\\u542B option \\u7684\\u5404\\u79CD\\u5C5E\\u6027\\uFF0C\\u4F8B\\u5982 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"onChange({ value, label, ...rest })\")), mdx(Notice, {\n    title: \"\\u6CE8\\u610F\",\n    mdxType: \"Notice\"\n  }, \"\\u5F53 onChangeWithObject \\u7F6E\\u4E3A true \\u65F6\\uFF0C`defaultValue`/`Value`\\u4E5F\\u5E94\\u4E3A object\\uFF0C\\u4E14\\u987B\\u5E26\\u6709`value`\\u3001`label` key\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React from 'react';\\nimport { Select, TextArea } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const list = [\\n        { value: 'douyin', label: '\\u6296\\u97F3', type: 1 },\\n        { value: 'ulikecam', label: '\\u8F7B\\u989C\\u76F8\\u673A', type: 2 },\\n        { value: 'jianying', label: '\\u526A\\u6620', type: 3 },\\n        { value: 'toutiao', label: '\\u4ECA\\u65E5\\u5934\\u6761', type: 4 },\\n    ];\\n    const [cbValue, setCbValue] = useState();\\n    const [multipleCbValue, setMultipleCbValue] = useState();\\n\\n    const onChange = value => {\\n        setCbValue(value);\\n        console.log(value);\\n    };\\n\\n    const onMultipleChange = value => {\\n        setMultipleCbValue(value);\\n        console.log(value);\\n    };\\n\\n    return (\\n        <div>\\n            <div>\\n                <Select\\n                    style={{ width: 150 }}\\n                    onChangeWithObject\\n                    optionList={list}\\n                    placeholder=\\\"\\u5355\\u9009\\\"\\n                    defaultValue={list[0]}\\n                    onChange={onChange}\\n                ></Select>\\n                <h4>onChange\\u56DE\\u8C03:</h4>\\n                <TextArea style={{ width: 320, marginBottom: 48 }} autosize value={JSON.stringify(cbValue)} rows={2} />\\n            </div>\\n            <div>\\n                <Select\\n                    style={{ width: 320 }}\\n                    onChangeWithObject\\n                    multiple\\n                    optionList={list}\\n                    onChange={onMultipleChange}\\n                    placeholder=\\\"\\u591A\\u9009\\\"\\n                ></Select>\\n                <h4>onChange\\u56DE\\u8C03:</h4>\\n                <TextArea style={{ width: 320 }} autosize value={JSON.stringify(multipleCbValue)} />\\n            </div>\\n        </div>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u521B\\u5EFA\\u6761\\u76EE\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u8BBE\\u7F6E\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"allowCreate\"), \"\\uFF0C\\u53EF\\u4EE5\\u521B\\u5EFA\\u5E76\\u9009\\u4E2D\\u9009\\u9879\\u4E2D\\u4E0D\\u5B58\\u5728\\u7684\\u6761\\u76EE\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u5141\\u8BB8\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"renderCreateItem\"), \" \\u81EA\\u5B9A\\u4E49\\u521B\\u5EFA\\u6807\\u7B7E\\u65F6\\u7684\\u5185\\u5BB9\\u663E\\u793A\\uFF08\\u901A\\u8FC7\\u8FD4\\u56DE ReactNode\\uFF0C\\u6CE8\\u610F\\u4F60\\u9700\\u8981\\u81EA\\u5B9A\\u4E49\\u6837\\u5F0F\\uFF09\\uFF0C\\u8BE5\\u51FD\\u6570\\u9ED8\\u8BA4\\u503C\\u4E3A (input, isFocus, style) => '\\u521B\\u5EFA' + input\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u53EF\\u4EE5\\u914D\\u5408\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"defaultActiveFirstOption\"), \"\\u5C5E\\u6027\\u4F7F\\u7528\\uFF0C\\u81EA\\u52A8\\u9009\\u4E2D\\u7B2C\\u4E00\\u9879\\uFF0C\\u5F53\\u8F93\\u5165\\u5B8C\\u5185\\u5BB9\\u76F4\\u63A5\\u56DE\\u8F66\\u65F6\\uFF0C\\u53EF\\u7ACB\\u5373\\u521B\\u5EFA\"), mdx(Notice, {\n    title: \"\\u6CE8\\u610F\",\n    mdxType: \"Notice\"\n  }, \"\\u5F53\\u5F00\\u542FallowCreate\\u540E\\uFF0C\\u4E0D\\u4F1A\\u518D\\u54CD\\u5E94\\u5BF9Children\\u6216\\u8005optionList\\u7684\\u66F4\\u65B0\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const optionList = [\\n        { value: 'douyin', label: '\\u6296\\u97F3' },\\n        { value: 'ulikecam', label: '\\u8F7B\\u989C\\u76F8\\u673A' },\\n        { value: 'jianying', label: '\\u526A\\u6620' },\\n        { value: 'toutiao', label: '\\u4ECA\\u65E5\\u5934\\u6761' },\\n    ];\\n    return (\\n        <>\\n            <Select\\n                style={{ width: 400 }}\\n                optionList={optionList}\\n                allowCreate={true}\\n                multiple={true}\\n                filter={true}\\n                onChange={v => console.log(v)}\\n                defaultActiveFirstOption\\n            ></Select>\\n            <br />\\n            <br />\\n            <Select\\n                style={{ width: 400 }}\\n                optionList={optionList}\\n                allowCreate={true}\\n                multiple={true}\\n                filter={true}\\n                placeholder=\\\"With renderCreateItem\\\"\\n                renderCreateItem={(input, isFocus, style) => (<div style={{ padding: 10, ...style }}>Create Item\\uFF1A{input}</div>)}\\n                onChange={v => console.log(v)}\\n                defaultActiveFirstOption\\n            ></Select>\\n        </>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u865A\\u62DF\\u5316\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4F20\\u5165\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"virtualize\"), \"\\u65F6\\u5F00\\u542F\\u5217\\u8868\\u865A\\u62DF\\u5316\\uFF0C\\u7528\\u4E8E\\u5927\\u91CF Option \\u8282\\u70B9\\u7684\\u60C5\\u51B5\\u4F18\\u5316\\u6027\\u80FD\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"virtualize \\u662F\\u4E00\\u4E2A\\u5305\\u542B\\u4E0B\\u5217\\u503C\\u7684\\u5BF9\\u8C61\\uFF1A\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"height: Option \\u5217\\u8868\\u9AD8\\u5EA6\\u503C\\uFF0C\\u9ED8\\u8BA4 270 (v2.20.8 \\u524D\\u4E3A 300)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"width: Option \\u5217\\u8868\\u5BBD\\u5EA6\\u503C\\uFF0C\\u9ED8\\u8BA4 100%\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"itemSize: \\u6BCF\\u884C Option \\u7684\\u9AD8\\u5EA6\\uFF0C\\u5FC5\\u4F20\")), mdx(Notice, {\n    title: \"\\u6CE8\\u610F\\u4E8B\\u9879\",\n    mdxType: \"Notice\"\n  }, \"Semi Select virtualize \\u529F\\u80FD\\u662F\\u57FA\\u4E8E react-window \\u7684\\u5C01\\u88C5\\uFF0C\\u865A\\u62DF\\u5316\\u5217\\u8868\\u9ED8\\u8BA4\\u4F1A\\u88AB\\u5305\\u88F9\\u5728 `will-change: transform` \\u7684 div \\u5185\\u90E8\\u3002 \\u5728\\u67D0\\u4E9B\\u6D4F\\u89C8\\u5668\\uFF08\\u4F8B\\u5982 Chrome\\uFF09\\uFF0C\\u67D0\\u4E9B\\u7279\\u5B9A\\u7684\\u5C4F\\u5E55\\u5C3A\\u5BF8\\u4E0B\\uFF0C\\u5C4F\\u5E55\\u7269\\u7406\\u50CF\\u7D20\\u5C3A\\u5BF8\\u4E0E\\u6D4F\\u89C8\\u5668\\u5904\\u7406\\u7684\\u50CF\\u7D20\\u65E0\\u6CD5\\u5BF9\\u9F50\\u65F6\\uFF0C\\u4F1A\\u81EA\\u52A8\\u5F00\\u542F\\u6297\\u952F\\u9F7F\\u3002\\u4ECE\\u800C\\u5BFC\\u81F4\\u865A\\u62DF\\u5217\\u8868\\u4E2D\\u7684\\u6587\\u672C\\u5B57\\u4F53\\u53EF\\u80FD\\u4F1A\\u5728\\u7279\\u5B9A\\u573A\\u666F\\u4E0B\\u5B58\\u5728\\u6A21\\u7CCA\\u7684\\u60C5\\u51B5\\u3002 will-change \\u5BF9\\u4E8E\\u590D\\u6742\\u5143\\u7D20\\u7684\\u6E32\\u67D3\\u4F1A\\u6709\\u6027\\u80FD\\u6539\\u5584\\uFF0C\\u6240\\u4EE5\\u6211\\u4EEC\\u9ED8\\u8BA4\\u4E0D\\u4F1A\\u5BF9 react-window\\u7684\\u6837\\u5F0F\\u8FDB\\u884C\\u8986\\u76D6\\u3002\\u5982\\u679C\\u4F60\\u5E0C\\u671B\\u5173\\u95ED\\u8FD9\\u4E2A\\u6548\\u679C\\uFF0C\\u53EF\\u4EE5\\u901A\\u8FC7\\u81EA\\u884C\\u8986\\u76D6 CSS\\uFF0C\\u5C06 will-change \\u8BBE\\u7F6E\\u4E3A unset \\u89E3\\u51B3\"), mdx(Notice, {\n    title: \"\\u5173\\u4E8E\\u9AD8\\u5EA6\\u8BBE\\u7F6E\",\n    mdxType: \"Notice\"\n  }, \"\\u5F53 virtualize.height \\u5927\\u4E8E\\u9ED8\\u8BA4\\u503C 270px \\u65F6\\uFF0C\\u4E3A\\u4E86\\u907F\\u514D\\u51FA\\u73B0\\u53CC\\u6EDA\\u52A8\\u6761\\u95EE\\u9898\\uFF0C\\u9700\\u8981\\u5C06 maxHeight \\u5C5E\\u6027\\u8BBE\\u7F6E\\u4E3A\\u4E0E virtualize.height \\u76F8\\u540C\\u7684\\u503C\\u3002 \\u4F8B\\u5982\\uFF1A\\u5F53\\u8BBE\\u7F6E virtualize.height \\u4E3A 400px \\u65F6\\uFF0C\\u5E94\\u540C\\u65F6\\u8BBE\\u7F6E maxHeight=\", 400, \"\\u3002\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-css\"\n  }, \".semi-select-option-list > div {\\n    will-change: unset !important; // \\u7531\\u4E8E react-window\\u81EA\\u5E26\\u6837\\u5F0F\\u662F\\u5185\\u8054\\u7684\\uFF0C\\u6240\\u4EE5\\u8FD9\\u91CC\\u7528 important \\u8986\\u76D6\\n}\\n\")), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true hideInDSM\",\n    \"live\": \"true\",\n    \"hideInDSM\": true\n  }, \"import React from 'react';\\nimport { Select } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const newOptions = Array.from({ length: 3000 }, (v, i) => ({ label: `option-${i}`, value: i }));\\n    let virtualize = {\\n        height: 270,\\n        width: '100%',\\n        itemSize: 36, // px\\n    };\\n    return (\\n        <Select\\n            placeholder=\\\"\\u62E5\\u67093k\\u4E2AOption\\u7684Select\\\"\\n            style={{ width: 260 }}\\n            filter\\n            virtualize={virtualize}\\n            optionList={newOptions}\\n        ></Select>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u81EA\\u5B9A\\u4E49\\u89E6\\u53D1\\u5668\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5982\\u679C Select \\u9ED8\\u8BA4\\u7684\\u89E6\\u53D1\\u5668\\u6837\\u5F0F\\u6EE1\\u8DB3\\u4E0D\\u4E86\\u4F60\\u7684\\u9700\\u6C42\\uFF0C\\u53EF\\u4EE5\\u7528\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"triggerRender\"), \"\\u81EA\\u5B9A\\u4E49\\u9009\\u62E9\\u6846\\u7684\\u5C55\\u793A\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u5982\\u679C\\u60F3\\u4FDD\\u7559\\u641C\\u7D22\\u7B5B\\u9009\\u80FD\\u529B\\uFF0C\\u53C8\\u4E0D\\u5E0C\\u671B\\u81EA\\u5DF1\\u6E32\\u67D3 Input \\u76F8\\u5173\\u7684\\u7ED3\\u6784\\uFF0C\\u53EF\\u4EE5\\u540C\\u65F6\\u901A\\u8FC7 searchPosition='dropdown'\\uFF0C\\u5C06\\u9ED8\\u8BA4\\u7684\\u641C\\u7D22\\u6846\\u7F6E\\u4E8E\\u4E0B\\u62C9\\u5217\\u8868\\u4E2D\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"triggerRender \\u5165\\u53C2\\u5982\\u4E0B\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-typescript\"\n  }, \"interface TriggerRenderProps {\\n  value: array<object> // \\u5F53\\u524D\\u6240\\u6709\\u5DF2\\u9009\\u4E2D\\u7684options\\n  inputValue: string; // \\u5F53\\u524Dinput\\u6846\\u7684\\u8F93\\u5165\\u503C\\n  onSearch: (inputValue: string) => void; // \\u7528\\u4E8E\\u66F4\\u65B0 input\\u6846\\u503C\\u7684\\u51FD\\u6570\\uFF0C\\u5F53\\u4F60\\u5728triggerRender\\u81EA\\u5B9A\\u4E49\\u7684Input\\u7EC4\\u4EF6\\u503C\\u66F4\\u65B0\\u65F6\\u4F60\\u5E94\\u8BE5\\u8C03\\u7528\\u8BE5\\u51FD\\u6570\\uFF0C\\u7528\\u4E8E\\u5411Select\\u5185\\u90E8\\u540C\\u6B65\\u72B6\\u6001\\u3002\\u6CE8\\u610F filter \\u9700\\u540C\\u65F6\\u8BBE\\u4E3Atrue, v2.32 \\u63D0\\u4F9B\\n  onRemove: (option: object) => void; // \\u7528\\u4E8E\\u79FB\\u9664\\u5355\\u4E2A\\u5DF2\\u9009\\u9879\\uFF0Coption\\u81F3\\u5C11\\u9700\\u5E26\\u6709 label\\u3001value \\u4E24\\u9879\\uFF0Cv2.32\\u63D0\\u4F9B\\n  onClear: () => void; // \\u7528\\u4E8E\\u6E05\\u7A7A\\u503C\\u7684\\u51FD\\u6570\\n  disabled: boolean; // \\u662F\\u5426\\u7981\\u7528Select\\n  placeholder: string; // Select\\u7684placeholder\\n  componentProps: object // \\u6240\\u6709\\u7528\\u6237\\u4F20\\u7ED9Select\\u7684props\\n}\\n\")), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState } from 'react';\\nimport { Select, Tag } from '@douyinfe/semi-ui';\\nimport { IconAppCenter, IconChevronDown } from '@douyinfe/semi-icons';\\n\\n() => {\\n    const [valList, setValList] = useState(['douyin', 'ulikecam']);\\n    const list = [\\n        { value: 'douyin', label: '\\u6296\\u97F3' },\\n        { value: 'ulikecam', label: '\\u8F7B\\u989C\\u76F8\\u673A' },\\n        { value: 'jianying', label: '\\u526A\\u6620' },\\n        { value: 'toutiao', label: '\\u4ECA\\u65E5\\u5934\\u6761' },\\n    ];\\n    const triggerRender = ({ value }) => {\\n        return (\\n            <div\\n                style={{\\n                    minWidth: '112',\\n                    backgroundColor: 'var(--semi-color-primary-light-default)',\\n                    height: 32,\\n                    display: 'flex',\\n                    alignItems: 'center',\\n                    paddingLeft: 12,\\n                    borderRadius: 3,\\n                    color: 'var(--semi-color-primary)',\\n                }}\\n            >\\n                <div\\n                    style={{\\n                        fontWeight: 600,\\n                        flexShrink: 0,\\n                        fontSize: 14,\\n                    }}\\n                >\\n                    \\u4E1A\\u52A1\\u7EBF\\n                </div>\\n                <div\\n                    style={{\\n                        margin: 4,\\n                        whiteSpace: 'nowrap',\\n                        textOverflow: 'ellipsis',\\n                        flexGrow: 1,\\n                        overflow: 'hidden',\\n                    }}\\n                >\\n                    {value.map(item => item.label).join(' , ')}\\n                </div>\\n                <IconAppCenter style={{ marginRight: 8, flexShrink: 0 }} />\\n            </div>\\n        );\\n    };\\n\\n    const triggerRender2 = ({ value, ...rest }) => {\\n        return (\\n            <div\\n                style={{\\n                    margin: 4,\\n                    whiteSpace: 'nowrap',\\n                    textOverflow: 'ellipsis',\\n                    flexGrow: 1,\\n                    overflow: 'hidden',\\n                    display: 'flex',\\n                    alignItems: 'center',\\n                }}\\n            >\\n                <Tag size='large' color='cyan' shape='circle' suffixIcon={<IconChevronDown />}>\\n                    {value.map(item => item.label).join(' / ')}\\n                </Tag>\\n            </div>\\n        );\\n    };\\n\\n    return (\\n        <div>\\n            <h4>\\u4E0D\\u540C\\u80CC\\u666F\\u8272\\u7684\\u89E6\\u53D1\\u5668</h4>\\n            <Select\\n                value={valList}\\n                triggerRender={triggerRender}\\n                optionList={list}\\n                onChange={value => setValList(value)}\\n                multiple\\n                filter\\n                searchPosition='dropdown'\\n                style={{ width: 240 }}\\n            ></Select>\\n            <br />\\n            <br />\\n            <h4>\\u4F7F\\u7528 circle Tag \\u4F5C\\u4E3A\\u89E6\\u53D1\\u5668</h4>\\n            <Select\\n                value={valList}\\n                onChange={value => setValList(value)}\\n                triggerRender={triggerRender2}\\n                optionList={list}\\n                filter\\n                multiple\\n                searchPosition='dropdown'\\n                style={{ width: 240, marginTop: 20, outline: 0 }}\\n            ></Select>\\n        </div>\\n    );\\n};\\n\\n\")), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4E0B\\u4F8B\\u662F\\u66F4\\u590D\\u6742\\u7684\\u4F8B\\u5B50\\uFF1A\\u590D\\u7528\\u4E86 TagInput \\u62D6\\u62FD\\u6392\\u5E8F\\u80FD\\u529B\\uFF0C\\u901A\\u8FC7 triggerRender \\u4E3A Select \\u589E\\u52A0\\u6392\\u5E8F\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React, { useState } from 'react';\\nimport { Select, TagInput } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [valList, setValList] = useState(['douyin', 'ulikecam']);\\n    const [inputVal, setInputVal] = useState('');\\n    const list = [\\n        { value: 'douyin', label: '\\u6296\\u97F3' },\\n        { value: 'ulikecam', label: '\\u8F7B\\u989C\\u76F8\\u673A' },\\n        { value: 'jianying', label: '\\u526A\\u6620' },\\n        { value: 'toutiao', label: '\\u4ECA\\u65E5\\u5934\\u6761' },\\n    ];\\n     \\n    const handleSort = (currentLabels) => {\\n        const newValue = currentLabels.map(item => list.find((i) => i.label === item).value)\\n        setValList(newValue);\\n    };\\n\\n    const triggerRender = ({ value, onSearch, onClear }) => {\\n        return (\\n            <div onKeyDown={e=>e.stopPropagation()}>\\n                <TagInput\\n                    draggable\\n                    allowDuplicates={false}\\n                    value={value.map(item => item.label)}\\n                    inputValue={inputVal}\\n                    onInputChange={(word) => {\\n                        onSearch(word);\\n                        setInputVal(word);\\n                    }}\\n                    onChange={handleSort}\\n                    onClear={() => onClear()}\\n                    showClear\\n                />\\n            </div>\\n        );\\n    }; \\n  \\n    return (\\n        <>\\n            <h4>\\u53EF\\u5BF9\\u5DF2\\u9009\\u9879\\u62D6\\u62FD\\u91CD\\u65B0\\u6392\\u5E8F\\u7684 Select </h4>\\n            <Select\\n                value={valList}\\n                triggerRender={triggerRender}\\n                optionList={list}\\n                onChange={value => setValList(value)}\\n                multiple\\n                filter\\n                style={{ width: 240 }}\\n            ></Select>\\n        </>\\n    );\\n};\\n\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u81EA\\u5B9A\\u4E49\\u5019\\u9009\\u9879\\u6E32\\u67D3\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u7B80\\u5355\\u7684\\u81EA\\u5B9A\\u4E49\\uFF1A\\u901A\\u8FC7 Option \\u7684 label \\u5C5E\\u6027\\u6216\\u8005 children \\u4F20\\u5165 ReactNode\\uFF0C\\u4F60\\u53EF\\u4EE5\\u63A7\\u5236\\u5019\\u9009\\u9879\\u7684\\u6E32\\u67D3\\uFF0C\\u6B64\\u65F6\\u5185\\u5BB9\\u4F1A\\u81EA\\u52A8\\u5E26\\u4E0A\\u5185\\u8FB9\\u8DDD\\u3001\\u80CC\\u666F\\u8272\\u7B49\\u6837\\u5F0F\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5B8C\\u5168\\u81EA\\u5B9A\\u4E49\\uFF1A\\u901A\\u8FC7\\u4F20\\u5165\", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"renderOptionItem\"), \"\\uFF0C\\u4F60\\u53EF\\u4EE5\\u5B8C\\u5168\\u63A5\\u7BA1\\u5217\\u8868\\u4E2D\\u5019\\u9009\\u9879\\u7684\\u6E32\\u67D3\\uFF0C\\u5E76\\u4E14\\u4ECE\\u56DE\\u8C03\\u5165\\u53C2\\u4E2D\\uFF0C\\u83B7\\u53D6\\u5230\\u76F8\\u5173\\u7684\\u72B6\\u6001\\u503C\\u3002\\u5B9E\\u73B0\\u66F4\\u9AD8\\u81EA\\u7531\\u5EA6\\u7684\\u7ED3\\u6784\\u6E32\\u67D3\", mdx(\"br\", {\n    parentName: \"li\"\n  }), \"\\u6CE8\\u610F\\u4E8B\\u9879\\uFF1A\", mdx(\"ol\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"props \\u4F20\\u5165\\u7684 style \\u9700\\u5728 wrapper dom \\u4E0A\\u8FDB\\u884C\\u6D88\\u8D39\\uFF0C\\u5426\\u5219\\u5728\\u865A\\u62DF\\u5316\\u573A\\u666F\\u4E0B\\u4F1A\\u65E0\\u6CD5\\u6B63\\u5E38\\u4F7F\\u7528\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"props \\u4F20\\u5165\\u7684 className\\u3001onMouseEnter \\u9700\\u5728 wrapper dom \\u4E0A\\u8FDB\\u884C\\u6D88\\u8D39\\uFF0C\\u5426\\u5219\\u4E0A\\u4E0B\\u952E\\u76D8\\u64CD\\u4F5C\\u65F6\\u663E\\u793A\\u4F1A\\u6709\\u95EE\\u9898\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"\\u9009\\u4E2D(selected)\\u3001\\u805A\\u7126(focused)\\u3001\\u7981\\u7528(disabled)\\u7B49\\u72B6\\u6001\\u7684\\u6837\\u5F0F\\u9700\\u81EA\\u884C\\u52A0\\u4E0A\\uFF0C\\u4F60\\u53EF\\u4EE5\\u4ECE props \\u4E2D\\u83B7\\u53D6\\u5230\\u76F8\\u5BF9\\u7684 boolean \\u503C\"), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"\\u5982\\u679C\\u4F60\\u7684\\u81EA\\u5B9A\\u4E49 item \\u4E3A Select.Option\\uFF0C\\u9700\\u8981\\u5C06 renderProps.onClick \\u900F\\u4F20\\u7ED9 Option \\u7684 onSelect prop\")))), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\",\n    \"metastring\": \"live=true\",\n    \"live\": \"true\"\n  }, \"import React from 'react';\\nimport { Select, Checkbox, Highlight } from '@douyinfe/semi-ui';\\n\\n() => {\\n    const [inputValue, setInputValue] = useState('');\\n    const renderOptionItem = renderProps => {\\n        const {\\n            disabled,\\n            selected,\\n            label,\\n            value,\\n            focused,\\n            className,\\n            style,\\n            onMouseEnter,\\n            onClick,\\n            empty,\\n            emptyContent,\\n            ...rest\\n        } = renderProps;\\n        const optionCls = classNames({\\n            ['custom-option-render']: true,\\n            ['custom-option-render-focused']: focused,\\n            ['custom-option-render-disabled']: disabled,\\n            ['custom-option-render-selected']: selected,\\n            className\\n        });\\n        const searchWords = [inputValue];\\n\\n        // Notice\\uFF1A\\n        // 1.props\\u4F20\\u5165\\u7684style\\u9700\\u5728wrapper dom\\u4E0A\\u8FDB\\u884C\\u6D88\\u8D39\\uFF0C\\u5426\\u5219\\u5728\\u865A\\u62DF\\u5316\\u573A\\u666F\\u4E0B\\u4F1A\\u65E0\\u6CD5\\u6B63\\u5E38\\u4F7F\\u7528\\n        // 2.\\u9009\\u4E2D(selected)\\u3001\\u805A\\u7126(focused)\\u3001\\u7981\\u7528(disabled)\\u7B49\\u72B6\\u6001\\u7684\\u6837\\u5F0F\\u9700\\u81EA\\u884C\\u52A0\\u4E0A\\uFF0C\\u4F60\\u53EF\\u4EE5\\u4ECEprops\\u4E2D\\u83B7\\u53D6\\u5230\\u76F8\\u5BF9\\u7684boolean\\u503C\\n        // 3.onMouseEnter\\u3001className\\u9700\\u5728wrapper dom\\u4E0A\\u7ED1\\u5B9A\\uFF0C\\u5426\\u5219\\u4E0A\\u4E0B\\u952E\\u76D8\\u64CD\\u4F5C\\u65F6\\u663E\\u793A\\u4F1A\\u6709\\u95EE\\u9898\\n        \\n        return (\\n            <div style={style} className={optionCls} onClick={() => onClick()} onMouseEnter={e => onMouseEnter()}>\\n                <Checkbox checked={selected} />\\n                <div className=\\\"option-right\\\">\\n                    <Highlight sourceString={label} searchWords={searchWords} />\\n                </div>\\n            </div>\\n        );\\n    };\\n\\n    const optionList = [\\n        { value: 'douyin', label: '\\u6296\\u97F3', otherKey: 0 },\\n        { value: 'ulikecam', label: '\\u8F7B\\u989C\\u76F8\\u673A', disabled: true, otherKey: 1 },\\n        { value: 'jianying', label: '\\u526A\\u6620', otherKey: 2 },\\n        { value: 'toutiao', label: '\\u4ECA\\u65E5\\u5934\\u6761', otherKey: 3 },\\n    ];\\n\\n    return (\\n        <>\\n            <Select\\n                filter\\n                placeholder=\\\"\\u5355\\u9009\\\"\\n                onSearch={(v) => setInputValue(v)}\\n                dropdownClassName=\\\"components-select-demo-renderOptionItem\\\"\\n                optionList={optionList}\\n                style={{ width: 180 }}\\n                renderOptionItem={renderOptionItem}\\n            />\\n            <br />\\n            <br />\\n            <Select\\n                filter\\n                placeholder=\\\"\\u591A\\u9009\\\"\\n                multiple\\n                onSearch={(v) => setInputValue(v)}\\n                dropdownClassName=\\\"components-select-demo-renderOptionItem\\\"\\n                optionList={optionList}\\n                style={{ width: 320 }}\\n                renderOptionItem={renderOptionItem}\\n            />\\n        </>\\n    );\\n};\\n\")), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-scss\"\n  }, \".components-select-demo-renderOptionItem {\\n    .custom-option-render {\\n        display: flex;\\n        font-size: 14px;\\n        line-height: 20px;\\n        word-break: break-all;\\n        padding-left: 12px;\\n        padding-right: 12px;\\n        padding-top: 8px;\\n        padding-bottom: 8px;\\n        color: var(--semi-color-text-0);\\n        position: relative;\\n        display: flex;\\n        align-items: center;\\n        cursor: pointer;\\n        box-sizing: border-box;\\n        .option-right {\\n            margin-left: 8px;\\n            display: inline-flex;\\n            align-items: center;\\n        }\\n        &:active {\\n            background-color: var(--semi-color-fill-1);\\n        }\\n        &-focused {\\n            background-color: var(--semi-color-fill-0);\\n        }\\n        &-selected {\\n            //font-weight: 700;\\n        }\\n        &-disabled {\\n            color: var(--semi-color-disabled-text);\\n            cursor: not-allowed;\\n        }\\n        &:first-of-type {\\n            margin-top: 4px;\\n        }\\n        &:last-of-type {\\n            margin-bottom: 4px;\\n        }\\n    }\\n}\\n\"))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"API \\u53C2\\u8003\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Select Props\"), mdx(\"table\", {\n    parentName: \"section\"\n  }, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5C5E\\u6027\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8BF4\\u660E\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u7C7B\\u578B\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u9ED8\\u8BA4\\u503C\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u7248\\u672C\"))), mdx(\"tbody\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"allowCreate\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u5141\\u8BB8\\u7528\\u6237\\u521B\\u5EFA\\u65B0\\u6761\\u76EE\\uFF0C\\u9700\\u914D\\u5408 filter \\u4F7F\\u7528\\u3002\\u8BE5\\u9879\\u4E3Atrue\\u65F6\\u4E0D\\u518D\\u54CD\\u5E94 optionList\\u7684\\u53D8\\u66F4\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"arrowIcon\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u81EA\\u5B9A\\u4E49\\u53F3\\u4FA7\\u4E0B\\u62C9\\u7BAD\\u5934 Icon\\uFF0C\\u5F53 showClear \\u5F00\\u5173\\u6253\\u5F00\\u4E14\\u5F53\\u524D\\u6709\\u9009\\u4E2D\\u503C\\u65F6\\uFF0Chover \\u4F1A\\u4F18\\u5148\\u663E\\u793A clear icon\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"autoAdjustOverflow\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6D6E\\u5C42\\u88AB\\u906E\\u6321\\u65F6\\u662F\\u5426\\u81EA\\u52A8\\u8C03\\u6574\\u65B9\\u5411\\uFF08\\u6682\\u65F6\\u4EC5\\u652F\\u6301\\u7AD6\\u76F4\\u65B9\\u5411\\uFF0C\\u4E14\\u63D2\\u5165\\u7684\\u7236\\u7EA7\\u4E3A body\\uFF09\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"true\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"autoClearSearchValue\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u9009\\u4E2D\\u9009\\u9879\\u540E\\uFF0C\\u662F\\u5426\\u81EA\\u52A8\\u6E05\\u7A7A\\u641C\\u7D22\\u5173\\u952E\\u5B57\\uFF0C\\u5F53 mutilple\\u3001filter \\u90FD\\u5F00\\u542F\\u65F6\\u751F\\u6548\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"true\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.3.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"autoFocus\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u521D\\u59CB\\u6E32\\u67D3\\u65F6\\u662F\\u5426\\u81EA\\u52A8 focus\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"borderless\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u65E0\\u8FB9\\u6846\\u6A21\\u5F0F  >=2.33.0\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"className\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u7C7B\\u540D\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"clearIcon\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u53EF\\u7528\\u4E8E\\u81EA\\u5B9A\\u4E49\\u6E05\\u9664\\u6309\\u94AE, showClear\\u4E3Atrue\\u65F6\\u6709\\u6548\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.25.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"clickToHide\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5DF2\\u5C55\\u5F00\\u65F6\\uFF0C\\u70B9\\u51FB\\u9009\\u62E9\\u6846\\u662F\\u5426\\u81EA\\u52A8\\u6536\\u8D77\\u4E0B\\u62C9\\u5217\\u8868\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"defaultValue\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u521D\\u59CB\\u9009\\u4E2D\\u7684\\u503C\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\", \"|\", \"number\", \"|\", \"array\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"defaultOpen\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u9ED8\\u8BA4\\u5C55\\u5F00\\u4E0B\\u62C9\\u5217\\u8868\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"disabled\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u7981\\u7528\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"defaultActiveFirstOption\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u9ED8\\u8BA4\\u9AD8\\u4EAE\\u7B2C\\u4E00\\u4E2A\\u9009\\u9879\\uFF08\\u6309\\u56DE\\u8F66\\u53EF\\u76F4\\u63A5\\u9009\\u4E2D\\uFF09 \", mdx(\"br\", null), mdx(\"strong\", {\n    parentName: \"td\"\n  }, \"v2.17.0 \\u4E4B\\u540E\\u9ED8\\u8BA4\\u503C\\u4ECE false \\u53D8\\u4E3A true\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"true\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"dropdownClassName\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F39\\u51FA\\u5C42\\u7684 className\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"dropdownMatchSelectWidth\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u4E0B\\u62C9\\u83DC\\u5355\\u6700\\u5C0F\\u5BBD\\u5EA6\\u662F\\u5426\\u7B49\\u4E8E Select\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"true\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"dropdownStyle\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F39\\u51FA\\u5C42\\u7684\\u6837\\u5F0F\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"object\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"dropdownMargin\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F39\\u51FA\\u5C42\\u8BA1\\u7B97\\u6EA2\\u51FA\\u65F6\\u7684\\u589E\\u52A0\\u7684\\u5197\\u4F59\\u503C\\uFF0C\\u8BE6\\u89C1\", mdx(\"a\", {\n    parentName: \"td\",\n    \"href\": \"https://github.com/DouyinFE/semi-design/issues/549\"\n  }, \"issue#549\"), \"\\uFF0C\\u4F5C\\u7528\\u540C Tooltip margin\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"object\", \"|\", \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.25.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"emptyContent\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u65E0\\u7ED3\\u679C\\u65F6\\u5C55\\u793A\\u7684\\u5185\\u5BB9\\u3002\\u8BBE\\u4E3A null \\u65F6\\uFF0C\\u4E0B\\u62C9\\u5217\\u8868\\u5C06\\u4E0D\\u5C55\\u793A\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\", \"|\", \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ellipsisTrigger\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F53 maxTagCount \\u5B58\\u5728\\u4E14\\u4E3A\\u591A\\u9009\\u65F6\\uFF0C\\u662F\\u5426\\u5BF9\\u6EA2\\u51FA\\u90E8\\u5206\\u7684 tag \\u505A\\u81EA\\u9002\\u5E94\\u5904\\u7406(\\u5F53\\u5BBD\\u5EA6\\u4E0D\\u8DB3\\u65F6\\uFF0C\\u6700\\u540E\\u4E00\\u4E2Atag\\u5185\\u5BB9\\u4F5C\\u622A\\u65AD\\u5904\\u7406)\\u3002\\u5F00\\u542F\\u8BE5\\u529F\\u80FD\\u540E\\u4F1A\\u6709\\u4E00\\u5B9A\\u6027\\u80FD\\u635F\\u8017\\uFF0C\\u4E0D\\u63A8\\u8350\\u5728\\u5927\\u8868\\u5355\\u573A\\u666F\\u4E0B\\u4F7F\\u7528\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.28.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"expandRestTagsOnClick\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F53maxTagCount\\u5B58\\u5728\\u4E14\\u4E3A\\u591A\\u9009\\u65F6\\uFF0Cselect \\u5728\\u9762\\u677F\\u6253\\u5F00\\u72B6\\u6001\\u4E0B\\u662F\\u5426\\u5C55\\u5F00\\u591A\\u4F59\\u7684 Tag\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.28.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"filter\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u53EF\\u641C\\u7D22\\uFF0C\\u9ED8\\u8BA4\\u4E3A false\\u3002\\u4F20\\u5165 true \\u65F6\\uFF0C\\u4EE3\\u8868\\u5F00\\u542F\\u641C\\u7D22\\u5E76\\u91C7\\u7528\\u9ED8\\u8BA4\\u8FC7\\u6EE4\\u7B56\\u7565\\uFF08label \\u662F\\u5426\\u4E0E sugInput \\u5339\\u914D\\uFF09\\uFF0C\\u4F20\\u5165\\u503C\\u4E3A\\u51FD\\u6570\\u65F6\\uFF0C\\u4F1A\\u63A5\\u6536 sugInput, option \\u4E24\\u4E2A\\u53C2\\u6570\\uFF0C\\u5F53 option \\u7B26\\u5408\\u7B5B\\u9009\\u6761\\u4EF6\\u5E94\\u8FD4\\u56DE true\\uFF0C\\u5426\\u5219\\u8FD4\\u56DE false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean \", \"|\", \"function(sugInput, option)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"getPopupContainer\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6307\\u5B9A\\u7236\\u7EA7 DOM\\uFF0C\\u5F39\\u5C42\\u5C06\\u4F1A\\u6E32\\u67D3\\u81F3\\u8BE5 DOM \\u4E2D\\uFF0C\\u81EA\\u5B9A\\u4E49\\u9700\\u8981\\u8BBE\\u7F6E \", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"position: relative\"), \" \\u8FD9\\u4F1A\\u6539\\u53D8\\u6D6E\\u5C42 DOM \\u6811\\u4F4D\\u7F6E\\uFF0C\\u4F46\\u4E0D\\u4F1A\\u6539\\u53D8\\u89C6\\u56FE\\u6E32\\u67D3\\u4F4D\\u7F6E\\u3002\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function():HTMLElement\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"() => document.body\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"inputProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"filter \\u4E3A true \\u65F6, input \\u8F93\\u5165\\u6846\\u7684\\u989D\\u5916\\u914D\\u7F6E\\u53C2\\u6570\\uFF0C\\u5177\\u4F53\\u53EF\\u914D\\u7F6E\\u5C5E\\u6027\\u8BF7\\u53C2\\u8003 Input \\u7EC4\\u4EF6\\uFF08\\u6CE8\\u610F\\uFF1A\\u8BF7\\u4E0D\\u8981\\u4F20\\u5165 value\\u3001ref\\u3001onChange\\u3001onFocus\\uFF0C\\u5426\\u5219\\u4F1A\\u8986\\u76D6 Select \\u76F8\\u5173\\u56DE\\u8C03\\uFF0C\\u5F71\\u54CD\\u7EC4\\u4EF6\\u884C\\u4E3A\\uFF09\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"object\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.2.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"innerTopSlot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6E32\\u67D3\\u5728\\u5F39\\u51FA\\u5C42\\u9876\\u90E8\\uFF0C\\u5728 optionList \\u5185\\u90E8\\u7684\\u81EA\\u5B9A\\u4E49 slot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"innerBottomSlot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6E32\\u67D3\\u5728\\u5F39\\u51FA\\u5C42\\u5E95\\u90E8\\uFF0C\\u5728 optionList \\u5185\\u90E8\\u7684\\u81EA\\u5B9A\\u4E49 slot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"loading\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u4E0B\\u62C9\\u5217\\u8868\\u662F\\u5426\\u5C55\\u793A\\u52A0\\u8F7D\\u52A8\\u753B\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"maxTagCount\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u591A\\u9009\\u6A21\\u5F0F\\u4E0B\\uFF0C\\u5DF2\\u9009\\u9879\\u8D85\\u51FA maxTagCount \\u65F6\\uFF0C\\u540E\\u7EED\\u9009\\u9879\\u4F1A\\u88AB\\u6E32\\u67D3\\u6210+N \\u7684\\u5F62\\u5F0F\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"max\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6700\\u591A\\u53EF\\u9009\\u51E0\\u9879\\uFF0C\\u4EC5\\u5728\\u591A\\u9009\\u6A21\\u5F0F\\u4E0B\\u751F\\u6548\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"maxHeight\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u4E0B\\u62C9\\u83DC\\u5355\\u4E2D \", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"optionList\"), \" \\u7684\\u6700\\u5927\\u9AD8\\u5EA6\\u3002\", mdx(\"strong\", {\n    parentName: \"td\"\n  }, \"\\u6CE8\\u610F\\uFF1A\\u5F53\\u4F7F\\u7528\\u865A\\u62DF\\u5316\\u5217\\u8868\\u4E14 virtualize.height \\u5927\\u4E8E\\u9ED8\\u8BA4\\u503C 270px \\u65F6\\uFF0C\\u9700\\u8981\\u5C06 maxHeight \\u8BBE\\u7F6E\\u4E3A\\u4E0E virtualize.height \\u76F8\\u540C\\u7684\\u503C\\uFF0C\\u4EE5\\u907F\\u514D\\u51FA\\u73B0\\u53CC\\u6EDA\\u52A8\\u6761\\u95EE\\u9898\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\", \"|\", \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"270\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"multiple\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u591A\\u9009\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"outerTopSlot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6E32\\u67D3\\u5728\\u5F39\\u51FA\\u5C42\\u9876\\u90E8\\uFF0C\\u4E0E optionList \\u5E73\\u7EA7\\u7684\\u81EA\\u5B9A\\u4E49 slot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"outerBottomSlot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6E32\\u67D3\\u5728\\u5F39\\u51FA\\u5C42\\u5E95\\u90E8\\uFF0C\\u4E0E optionList \\u5E73\\u7EA7\\u7684\\u81EA\\u5B9A\\u4E49 slot\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"optionList\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u53EF\\u4EE5\\u901A\\u8FC7\\u8BE5\\u5C5E\\u6027\\u4F20\\u5165 Option,\\u8BF7\\u786E\\u4FDD\\u6570\\u7EC4\\u5185\\u6BCF\\u4E2A\\u5143\\u7D20\\u90FD\\u5177\\u5907 label\\u3001value \\u5C5E\\u6027\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"array(\", \"[\", \"{value, label}\", \"]\", \")\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"placeholder\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u9009\\u62E9\\u6846\\u9ED8\\u8BA4\\u6587\\u5B57\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"position\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u83DC\\u5355\\u5C55\\u5F00\\u7684\\u4F4D\\u7F6E\\uFF0C\\u53EF\\u9009\\u9879\\u540C Tooltip position\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"'bottomLeft'\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"rePosKey\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u53EF\\u4EE5\\u66F4\\u65B0\\u8BE5\\u9879\\u503C\\u624B\\u52A8\\u89E6\\u53D1\\u5F39\\u51FA\\u5C42\\u7684\\u91CD\\u65B0\\u5B9A\\u4F4D\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\", \"|\", \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"prefix\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u9009\\u62E9\\u6846\\u7684\\u524D\\u7F00\\u6807\\u7B7E\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"preventScroll\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6307\\u793A\\u6D4F\\u89C8\\u5668\\u662F\\u5426\\u5E94\\u6EDA\\u52A8\\u6587\\u6863\\u4EE5\\u663E\\u793A\\u65B0\\u805A\\u7126\\u7684\\u5143\\u7D20\\uFF0C\\u4F5C\\u7528\\u4E8E\\u7EC4\\u4EF6\\u5185\\u7684 focus \\u65B9\\u6CD5\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"renderCreateItem\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"allowCreate \\u4E3A true \\u65F6\\uFF0C\\u53EF\\u81EA\\u5B9A\\u4E49\\u521B\\u5EFA\\u6807\\u7B7E\\u7684\\u6E32\\u67D3\\u3002\\u4E0E\\u865A\\u62DF\\u5316\\u7ED3\\u5408\\u4F7F\\u7528\\u65F6\\uFF0C\\u5FC5\\u987B\\u5C06\\u7B2C\\u4E09\\u4E2A\\u53C2\\u6570style\\u4F20\\u5165\\u81EA\\u5B9A\\u4E49DOM\\u4E2D\\u6D88\\u8D39(v2.44.1\\u540E\\u63D0\\u4F9B)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(inputValue:string, isFocus: boolean, style: object)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"inputValue => '\\u521B\\u5EFA' + inputValue\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"renderSelectedItem\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u901A\\u8FC7 renderSelectedItem \\u81EA\\u5B9A\\u4E49\\u9009\\u62E9\\u6846\\u4E2D\\u5DF2\\u9009\\u9879\\u6807\\u7B7E\\u7684\\u6E32\\u67D3\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(option)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"renderOptionItem\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u901A\\u8FC7 renderOptionItem \\u5B8C\\u5168\\u81EA\\u5B9A\\u4E49\\u4E0B\\u62C9\\u5217\\u8868\\u4E2D\\u5019\\u9009\\u9879\\u7684\\u6E32\\u67D3\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(props) \\u5165\\u53C2\\u8BE6\\u89C1 Demo\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"restTagsPopoverProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"Popover \\u7684\\u914D\\u7F6E\\u5C5E\\u6027\\uFF0C\\u53EF\\u4EE5\\u63A7\\u5236 position\\u3001zIndex\\u3001trigger \\u7B49\\uFF0C\\u5177\\u4F53\\u53C2\\u8003\", mdx(\"a\", {\n    parentName: \"td\",\n    \"href\": \"https:/lf3-static.semi.design/obj/semi-tos/semi_main/zh-CN/show/popover#API%20%E5%8F%82%E8%80%83\"\n  }, \"Popover\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"PopoverProps\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"{}\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.22.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"remote\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u5F00\\u542F\\u8FDC\\u7A0B\\u641C\\u7D22\\uFF0C\\u5F53 remote \\u4E3A true \\u65F6\\uFF0Cinput \\u5185\\u5BB9\\u6539\\u53D8\\u540E\\u4E0D\\u4F1A\\u8FDB\\u884C\\u672C\\u5730\\u7B5B\\u9009\\u5339\\u914D\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"searchPosition\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"filter\\u5F00\\u542F\\u65F6\\uFF0C\\u641C\\u7D22\\u6846\\u7684\\u4F4D\\u7F6E\\uFF0C\\u9ED8\\u8BA4\\u5728 trigger\\u4E2D\\uFF0C\\u53EF\\u4EE5\\u901A\\u8FC7\\u8BBE\\u4E3A 'dropdown' \\u5C06\\u641C\\u7D22\\u6846\\u7F6E\\u4E8E\\u4E0B\\u62C9\\u5217\\u8868\\u9876\\u90E8\\u3002\\u642D\\u914D triggerRender \\u4F7F\\u7528\\u53EF\\u4EE5\\u5B9E\\u73B0\\u66F4\\u9AD8\\u81EA\\u7531\\u5EA6\\u7684\\u4EA4\\u4E92\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"'trigger'\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.61.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"size\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5927\\u5C0F\\uFF0C\\u53EF\\u9009\\u503C \", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"default\"), \"/\", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"small\"), \"/\", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"large\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"'default'\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"style\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6837\\u5F0F\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"object\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"stopPropagation\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u963B\\u6B62\\u6D6E\\u5C42\\u4E0A\\u7684\\u70B9\\u51FB\\u4E8B\\u4EF6\\u5192\\u6CE1\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"true\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"suffix\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u9009\\u62E9\\u6846\\u7684\\u540E\\u7F00\\u6807\\u7B7E\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"showClear\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u5C55\\u793A\\u6E05\\u9664\\u6309\\u94AE\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"showArrow\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u5C55\\u793A\\u4E0B\\u62C9\\u7BAD\\u5934\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"true\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"showRestTagsPopover\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F53\\u8D85\\u8FC7 maxTagCount\\uFF0Chover \\u5230 +N \\u65F6\\uFF0C\\u662F\\u5426\\u901A\\u8FC7 Popover \\u663E\\u793A\\u5269\\u4F59\\u5185\\u5BB9\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"2.22.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"spacing\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6D6E\\u5C42\\u4E0E\\u9009\\u62E9\\u5668\\u7684\\u8DDD\\u79BB\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"4\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"triggerRender\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u81EA\\u5B9A\\u4E49\\u89E6\\u53D1\\u5668\\u6E32\\u67D3\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"value\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F53\\u524D\\u9009\\u4E2D\\u7684\\u7684\\u503C,\\u4F20\\u5165\\u8BE5\\u503C\\u65F6\\u5C06\\u4F5C\\u4E3A\\u53D7\\u63A7\\u7EC4\\u4EF6\\uFF0C\\u914D\\u5408 \", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"onChange\"), \" \\u4F7F\\u7528\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\", \"|\", \"number\", \"|\", \"array\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"validateStatus\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6821\\u9A8C\\u7ED3\\u679C\\uFF0C\\u53EF\\u9009\", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"warning\"), \"\\u3001\", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"error\"), \"\\u3001 \", mdx(\"inlineCode\", {\n    parentName: \"td\"\n  }, \"default\"), \"\\uFF08\\u53EA\\u5F71\\u54CD\\u6837\\u5F0F\\u80CC\\u666F\\u8272\\uFF09\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"'default'\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"virtualize\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5217\\u8868\\u865A\\u62DF\\u5316\\uFF0C\\u7528\\u4E8E\\u5927\\u91CF\\u8282\\u70B9\\u7684\\u60C5\\u51B5\\u4F18\\u5316\\u6027\\u80FD\\u8868\\u73B0\\uFF0C\\u7531 height, width, itemSize \\u7EC4\\u6210\\u3002\", mdx(\"strong\", {\n    parentName: \"td\"\n  }, \"\\u6CE8\\u610F\\uFF1A\\u5F53 height \\u5927\\u4E8E\\u9ED8\\u8BA4\\u503C 270px \\u65F6\\uFF0C\\u9700\\u540C\\u65F6\\u8BBE\\u7F6E maxHeight \\u4E3A\\u76F8\\u540C\\u503C\")), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"object\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"zIndex\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F39\\u5C42\\u7684 zIndex\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"1030\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onBlur\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5931\\u53BB\\u7126\\u70B9\\u65F6\\u7684\\u56DE\\u8C03\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(event)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onChange\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u53D8\\u5316\\u65F6\\u56DE\\u8C03\\u51FD\\u6570\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(value:string\", \"|\", \"number\", \"|\", \"array)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onCreate\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"allowCreate \\u4E3A true\\uFF0C\\u521B\\u5EFA\\u5907\\u9009\\u9879\\u65F6\\u7684\\u56DE\\u8C03\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(option)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onClear\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6E05\\u9664\\u6309\\u94AE\\u7684\\u56DE\\u8C03\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onChangeWithObject\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u5C06\\u9009\\u4E2D\\u9879 option \\u7684\\u5176\\u4ED6\\u5C5E\\u6027\\u4F5C\\u4E3A\\u56DE\\u8C03\\u3002\\u8BBE\\u4E3A true \\u65F6\\uFF0ConChange \\u7684\\u5165\\u53C2\\u7C7B\\u578B\\u4F1A\\u4ECE string \\u53D8\\u4E3A object: { value, label, ...rest }\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onDropdownVisibleChange\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u4E0B\\u62C9\\u83DC\\u5355\\u5C55\\u5F00/\\u6536\\u8D77\\u65F6\\u7684\\u56DE\\u8C03\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(visible:boolean)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onListScroll\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5019\\u9009\\u9879\\u5217\\u8868\\u6EDA\\u52A8\\u65F6\\u7684\\u56DE\\u8C03\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(e)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onSearch\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"input \\u8F93\\u5165\\u6846\\u5185\\u5BB9\\u53D1\\u751F\\u6539\\u53D8\\u65F6\\u56DE\\u8C03\\u51FD\\u6570\\uFF0C\\u7B2C\\u4E8C\\u4E2A\\u53C2\\u6570\\u4E8E v2.31 \\u540E\\u63D0\\u4F9B\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(sugInput:string, e: ReactEvent)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onSelect\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u88AB\\u9009\\u4E2D\\u65F6\\u7684\\u56DE\\u8C03\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(value, option)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onDeselect\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u53D6\\u6D88\\u9009\\u4E2D\\u65F6\\u7684\\u56DE\\u8C03\\uFF0C\\u4EC5\\u5728\\u591A\\u9009\\u65F6\\u6709\\u6548\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(value, option)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onExceed\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5F53\\u8BD5\\u56FE\\u9009\\u62E9\\u6570\\u8D85\\u51FA max \\u9650\\u5236\\u65F6\\u7684\\u56DE\\u8C03\\uFF0C\\u4EC5\\u5728\\u591A\\u9009\\u65F6\\u751F\\u6548\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(option)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"onFocus\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u83B7\\u5F97\\u7126\\u70B9\\u65F6\\u7684\\u56DE\\u8C03\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"function(event)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })))), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Option Props\"), mdx(\"hr\", {\n    parentName: \"section\"\n  }), mdx(\"blockquote\", {\n    parentName: \"section\"\n  }, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u4E0D\\u540C Option \\u7684 label \\u5FC5\\u987B\\u552F\\u4E00\\uFF0C\\u4E0D\\u5141\\u8BB8\\u91CD\\u590D\"))), mdx(\"table\", {\n    parentName: \"section\"\n  }, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5C5E\\u6027\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8BF4\\u660E\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u7C7B\\u578B\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u9ED8\\u8BA4\\u503C\"))), mdx(\"tbody\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"className\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6837\\u5F0F\\u7C7B\\u540D\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"disabled\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u662F\\u5426\\u7981\\u7528\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"false\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"label\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5C55\\u793A\\u7684\\u6587\\u672C\\u3002\\u6E32\\u67D3\\u65F6\\u4F18\\u5148\\u53D6 label\\uFF0C\\u82E5\\u65E0\\u5219\\u53D6 children\\u3001value\\uFF0C\\u4F9D\\u6B21\\u964D\\u7EA7\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\", \"|\", \"ReactNode\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"showTick\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u88AB\\u9009\\u4E2D\\u65F6\\uFF0C\\u5C55\\u793A \\u221A \\u7684 Icon\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"boolean\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"true\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"style\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6837\\u5F0F\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"object\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"value\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5C5E\\u6027\\u503C\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\", \"|\", \"number\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })))), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"OptGroup Props\"), mdx(\"hr\", {\n    parentName: \"section\"\n  }), mdx(\"table\", {\n    parentName: \"section\"\n  }, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5C5E\\u6027\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8BF4\\u660E\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u7C7B\\u578B\"))), mdx(\"tbody\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"className\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6837\\u5F0F\\u7C7B\\u540D\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"string\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"label\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u5C55\\u793A\\u7684\\u6587\\u672C\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"ReactNode\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"style\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u6837\\u5F0F\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"object\"))))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"Methods\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u7ED1\\u5B9A\\u5728\\u7EC4\\u4EF6\\u5B9E\\u4F8B\\u4E0A\\u7684\\u65B9\\u6CD5\\uFF0C\\u53EF\\u4EE5\\u901A\\u8FC7 ref \\u8C03\\u7528\\u5B9E\\u73B0\\u67D0\\u4E9B\\u7279\\u6B8A\\u4EA4\\u4E92\"), mdx(\"table\", {\n    parentName: \"section\"\n  }, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u65B9\\u6CD5\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8BF4\\u660E\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u7248\\u672C\"))), mdx(\"tbody\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"close\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8C03\\u7528\\u65F6\\u53EF\\u4EE5\\u624B\\u52A8\\u5173\\u95ED\\u4E0B\\u62C9\\u5217\\u8868\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"open\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8C03\\u7528\\u65F6\\u53EF\\u4EE5\\u624B\\u52A8\\u5C55\\u5F00\\u4E0B\\u62C9\\u5217\\u8868\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"focus\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8C03\\u7528\\u65F6\\u53EF\\u4EE5\\u624B\\u52A8\\u805A\\u7126\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"clearInput\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8C03\\u7528\\u65F6\\u53EF\\u4EE5\\u624B\\u52A8\\u6E05\\u7A7A input \\u641C\\u7D22\\u6846\\u7684\\u503C\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"deselectAll\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8C03\\u7528\\u65F6\\u53EF\\u4EE5\\u624B\\u52A8\\u6E05\\u7A7A\\u6240\\u6709\\u5DF2\\u9009\\u9879\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"selectAll\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8C03\\u7528\\u65F6\\u53EF\\u4EE5\\u9009\\u4E2D\\u6240\\u6709 Option\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  })), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"search(value: string, event: event)\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u53EF\\u901A\\u8FC7 ref \\u8C03\\u7528\\u8BE5\\u65B9\\u6CD5\\u8FDB\\u884C\\u641C\\u7D22\\uFF0C\\u8BE5\\u641C\\u7D22\\u503C\\u4F1A\\u88AB\\u7F6E\\u7ED9 Input\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"v2.35.0\")), mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"rePosition\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"\\u8C03\\u7528\\u65F6\\u53EF\\u4EE5\\u624B\\u52A8\\u89E6\\u53D1\\u4E0B\\u62C9\\u5C42\\u91CD\\u65B0\\u5B9A\\u4F4D\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }))))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"Accessibility\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"ARIA\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Select trigger \\u7684 role \\u4E3A combobox\\uFF0C\\u5F39\\u51FA\\u5C42\\u7684 role \\u4E3A listbox\\uFF0C\\u53EF\\u9009\\u9879\\u7684 role \\u4E3A option\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Select trigger \\u5177\\u6709 aria-haspopup\\u3001aria-expanded\\u3001aria-controls \\u5C5E\\u6027\\uFF0C\\u8868\\u793A trigger \\u4E0E\\u5F39\\u51FA\\u5C42\\u7684\\u5173\\u7CFB\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u591A\\u9009\\u65F6\\uFF0Clistbox aria-multiselectable \\u4E3A true\\uFF0C\\u8868\\u793A\\u5F53\\u524D\\u53EF\\u4EE5\\u591A\\u9009\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Option \\u9009\\u4E2D\\u65F6\\uFF0Caria-selected \\u4E3A true\\uFF1B\\u5F53 Option \\u7981\\u7528\\u65F6\\uFF0Caria-disabled \\u4E3A true\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5C5E\\u6027 aria-activedescendant \\u80FD\\u591F\\u4FDD\\u8BC1\\u5728\\u6717\\u8BFB\\u65C1\\u767D\\u65F6\\u8BC6\\u522B\\u5230\\u5F53\\u524D\\u7684\\u9009\\u62E9\\u7684 option(\\u66F4\\u591A\\u7528\\u6CD5\\u8BF7\\u53C2\\u8003\", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_focus_activedescendant\"\n  }, \"Managing Focus in Composites Using aria-activedescendant\"), \")\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u952E\\u76D8\\u548C\\u7126\\u70B9\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u4E0D\\u5E26 Filter \\u529F\\u80FD\\u7684 Select\\uFF1A\")), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Select \\u805A\\u7126\\u540E\\uFF0C\\u952E\\u76D8\\u7528\\u6237\\u53EF\\u4EE5\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0A\\u7BAD\\u5934\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0B\\u7BAD\\u5934\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Enter\"), \" \\u952E\\u6253\\u5F00\\u4E0B\\u62C9\\u83DC\\u5355\\uFF0C\\u5E76\\u5C06\\u7126\\u70B9\\u81EA\\u52A8\\u805A\\u7126\\u5230\\u4E0B\\u62C9\\u83DC\\u5355\\u4E2D\\u7684\\u7B2C\\u4E00\\u4E2A\\u9009\\u9879\\u4E0A\\uFF08\", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"defaultActiveFirstOption\"), \" \\u9ED8\\u8BA4\\u4E3A true\\uFF09\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5F53\\u4E0B\\u62C9\\u83DC\\u5355\\u6253\\u5F00\\u65F6\\uFF1A\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Esc\"), \" \\u952E\\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Tab\"), \" \\u952E\\u53EF\\u4EE5\\u5173\\u95ED\\u83DC\\u5355\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0A\\u7BAD\\u5934\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0B\\u7BAD\\u5934\"), \" \\u53EF\\u4EE5\\u5207\\u6362\\u9009\\u9879\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u88AB\\u805A\\u7126\\u7684\\u9009\\u9879\\u53EF\\u4EE5\\u901A\\u8FC7 Enter \\u952E\\u9009\\u4E2D\\uFF0C\\u5E76\\u6536\\u8D77\\u9762\\u677F\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5F53\\u7126\\u70B9\\u5728\\u4E0B\\u62C9\\u83DC\\u5355\\u4E2D\\uFF0C\\u4E14\\u7528\\u6237\\u4F7F\\u7528\\u7684 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"innerBottomSlot\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"outerBottomSlot\"), \" \\u5C5E\\u6027\\u7684\\u81EA\\u5B9A\\u4E49 slot \\u4E2D\\u542B\\u6709\\u53EF\\u4EA4\\u4E92\\u5143\\u7D20\\u65F6\\uFF1A\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u53EF\\u4EE5\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Tab\"), \" \\u952E\\u5207\\u6362\\u5230\\u8FD9\\u4E9B\\u53EF\\u4EA4\\u4E92\\u5143\\u7D20\\u4E0A\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5F53\\u7126\\u70B9\\u5728\\u81EA\\u5B9A\\u4E49 slot \\u7684\\u9996\\u4E2A\\u53EF\\u4EA4\\u4E92\\u5143\\u7D20\\u4E0A\\u65F6\\uFF0C\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Shift\"), \" + \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Tab\"), \" \\uFF0C\\u7126\\u70B9\\u56DE\\u5230 Select \\u6846\\u4E0A\")))), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u5E26 Filter \\u529F\\u80FD\\u7684 Select\\uFF1A\")), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Select \\u805A\\u7126\\u540E\\uFF0C\\u952E\\u76D8\\u7528\\u6237\\u53EF\\u4EE5\\u901A\\u8FC7 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0A\\u7BAD\\u5934\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0B\\u7BAD\\u5934\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Enter\"), \" \\u952E\\u6253\\u5F00\\u4E0B\\u62C9\\u83DC\\u5355\\u3002\\u6B64\\u65F6\\u7126\\u70B9\\u4ECD\\u7136\\u5904\\u4E8E Select \\u6846\\uFF0C\\u7528\\u6237\\u53EF\\u4EE5\\u8F93\\u5165\\u5185\\u5BB9\\uFF0C\\u540C\\u65F6\\u4E5F\\u80FD\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0A\\u7BAD\\u5934\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"\\u4E0B\\u7BAD\\u5934\"), \" \\u5207\\u6362\\u9009\\u9879\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5F53\\u4E0B\\u62C9\\u83DC\\u5355\\u6253\\u5F00\\u65F6\\uFF1A\\u952E\\u76D8\\u4EA4\\u4E92\\u4E0E\\u4E0D\\u5E26 Filter \\u529F\\u80FD\\u7684 Select \\u4E00\\u81F4\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5F53\\u7126\\u70B9\\u5728 Select \\u6846\\u4E0A\\uFF0C\\u4E14\\u7528\\u6237\\u4F7F\\u7528\\u7684 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"innerBottomSlot\"), \" \\u6216 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"outerBottomSlot\"), \" \\u5C5E\\u6027\\u7684\\u81EA\\u5B9A\\u4E49 slot \\u4E2D\\u542B\\u6709\\u53EF\\u4EA4\\u4E92\\u5143\\u7D20\\u65F6\\uFF1A\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u53EF\\u4EE5\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Tab\"), \" \\u952E\\u5207\\u6362\\u5230\\u8FD9\\u4E9B\\u53EF\\u4EA4\\u4E92\\u5143\\u7D20\\u4E0A\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5F53\\u7126\\u70B9\\u5728\\u81EA\\u5B9A\\u4E49 slot \\u7684\\u9996\\u4E2A\\u53EF\\u4EA4\\u4E92\\u5143\\u7D20\\u4E0A\\u65F6\\uFF0C\\u4F7F\\u7528 \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Shift\"), \" + \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Tab\"), \" \\uFF0C\\u7126\\u70B9\\u56DE\\u5230 Select \\u6846\\u4E0A\"))))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u6587\\u6848\\u89C4\\u8303\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u9009\\u62E9\\u5668\\u6807\\u7B7E\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u7528 1-3 \\u4E2A\\u8BCD\\u63CF\\u8FF0\\u9700\\u8981\\u7528\\u6237\\u6240\\u505A\\u7684\\u8F93\\u5165\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4F7F\\u7528\\u8BED\\u53E5\\u4E66\\u5199\\u89C4\\u8303\\uFF08\\u9996\\u5B57\\u6BCD\\u5927\\u5199\\uFF0C\\u5176\\u4F59\\u5C0F\\u5199\\uFF09\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u907F\\u514D\\u4F7F\\u7528\\u6807\\u70B9\\u7B26\\u53F7\\u548C\\u4ECB\\u8BCD\\uFF08\\u201Cthe\\u201D, \\u201Can\\u201D, \\u201Ca\\u201D\\uFF09\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u6807\\u7B7E\\u9700\\u662F\\u72EC\\u7ACB\\u8BED\\u53E5\\u3002\\u4E0D\\u8981\\u8BA9\\u6807\\u7B7E\\u662F\\u524D\\u534A\\u53E5\\u8BED\\u53E5\\uFF0C\\u9009\\u9879\\u662F\\u540E\\u534A\\u53E5\\u8BED\\u53E5\\u3002\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4F7F\\u7528\\u63CF\\u8FF0\\u6027\\u8BED\\u53E5\\uFF0C\\u800C\\u4E0D\\u662F\\u6307\\u793A\\u6027\\u8BED\\u53E5\\u3002\\u5982\\u679C\\u9009\\u9879\\u9700\\u8981\\u66F4\\u591A\\u89E3\\u91CA\\uFF0C\\u53EF\\u4EE5\\u5728\\u9009\\u62E9\\u6846\\u4E0B\\u4F7F\\u7528\\u5E2E\\u52A9\\u6587\\u672C\\u3002\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u9009\\u62E9\\u5668\\u9009\\u9879\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5982\\u679C\\u6CA1\\u6709\\u9ED8\\u8BA4\\u9009\\u9879\\uFF0C\\u5C31\\u4F7F\\u7528\\u201CSelect\\u201D\\u505A\\u5360\\u4F4D\\u6587\\u6848\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u9009\\u9879\\u8981\\u6309\\u9996\\u5B57\\u6BCD\\u987A\\u5E8F\\u6216\\u8005\\u5176\\u4ED6\\u6709\\u903B\\u8F91\\u7684\\u6392\\u5217\\u987A\\u5E8F\\uFF0C\\u4F7F\\u7528\\u6237\\u66F4\\u597D\\u5730\\u627E\\u5230\\u9009\\u9879\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4F7F\\u7528\\u8BED\\u53E5\\u4E66\\u5199\\u89C4\\u8303\\uFF08\\u9996\\u5B57\\u6BCD\\u5927\\u5199\\uFF0C\\u5176\\u4F59\\u5C0F\\u5199\\uFF09\\uFF0C\\u907F\\u514D\\u5728\\u53E5\\u5C3E\\u4F7F\\u7528\\u9017\\u53F7\\u548C\\u5206\\u53F7\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u6E05\\u6670\\u8868\\u8FBE\\u51FA\\u9009\\u9879\\u6240\\u8868\\u793A\\u7684\\u9009\\u62E9\\u76EE\\u7684\"))))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u8BBE\\u8BA1\\u53D8\\u91CF\"), mdx(DesignToken, {\n    mdxType: \"DesignToken\"\n  })), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"TypeScript \\u6CDB\\u578B\\u652F\\u6301\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Select\"), \" \\u7EC4\\u4EF6\\u652F\\u6301\\u901A\\u8FC7\\u6CDB\\u578B\\u53C2\\u6570\\u6765\\u7EA6\\u675F \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"value\"), \" \\u7684\\u7C7B\\u578B\\uFF0C\\u4ECE\\u800C\\u63D0\\u4F9B\\u66F4\\u597D\\u7684\\u7C7B\\u578B\\u63A8\\u65AD\\u3002\"), mdx(\"pre\", {\n    parentName: \"section\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"import { Select } from '@douyinfe/semi-ui';\\n\\n// \\u6307\\u5B9A value \\u4E3A string \\u7C7B\\u578B\\n<Select<string>\\n    value={selectedValue}\\n    onChange={(value) => {\\n        // value \\u7C7B\\u578B\\u4E3A string | string[] | undefined\\n        setSelectedValue(value);\\n    }}\\n>\\n    <Select.Option value=\\\"option1\\\">\\u9009\\u9879 1</Select.Option>\\n    <Select.Option value=\\\"option2\\\">\\u9009\\u9879 2</Select.Option>\\n</Select>\\n\\n// \\u591A\\u9009\\u6A21\\u5F0F\\u4E0B\\uFF0Cvalue \\u7C7B\\u578B\\u4E3A string[]\\n<Select<string>\\n    multiple\\n    value={selectedValues}\\n    onChange={(value) => {\\n        // value \\u7C7B\\u578B\\u4E3A string | string[] | undefined\\uFF0C\\u7531\\u4E8E multiple \\u4E3A true\\uFF0C\\u5B9E\\u9645\\u4E3A string[]\\n        setSelectedValues(value as string[]);\\n    }}\\n>\\n    <Select.Option value=\\\"option1\\\">\\u9009\\u9879 1</Select.Option>\\n    <Select.Option value=\\\"option2\\\">\\u9009\\u9879 2</Select.Option>\\n</Select>\\n\")), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4F7F\\u7528\\u6CDB\\u578B\\u53C2\\u6570\\u540E\\uFF0C\\u4F60\\u53EF\\u4EE5\\u83B7\\u5F97\\u66F4\\u7CBE\\u786E\\u7684\\u7C7B\\u578B\\u63A8\\u65AD\\uFF0C\\u65E0\\u9700\\u518D\\u624B\\u52A8\\u8FDB\\u884C\\u7C7B\\u578B\\u8F6C\\u6362\\u3002\")), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"FAQ\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u4E3A\\u4EC0\\u4E48 Semi \\u7684 Select \\u8981\\u6C42 label \\u5FC5\\u987B\\u552F\\u4E00\\uFF0C\\u800C\\u4E0D\\u662F value \\u5FC5\\u987B\\u552F\\u4E00?\")), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u9996\\u5148\\uFF0C\\u6211\\u4EEC\\u4E00\\u5B9A\\u9700\\u8981\\u4E00\\u4E2A\\u552F\\u4E00\\u6807\\u8BC6\\u7B26\\u7528\\u6765\\u505A\\u9009\\u4E2D\\u7684\\u5224\\u65AD\\u3002\\u51E0\\u4E4E\\u6240\\u6709 UI \\u5E93\\uFF0C\\u5BF9 Select.Option \\u4F7F\\u7528\\u65F6\\uFF0C\\u6700\\u4F4E\\u8981\\u6C42\\u90FD\\u53EA\\u4F1A\\u8981\\u6C42\\u4F20\\u5165 label\\u3001value \\u4E24\\u4E2A\\u503C\\uFF0C\\u800C\\u4E0D\\u4F1A\\u518D\\u5355\\u72EC\\u8981\\u6C42\\u4F20\\u5165\\u4E00\\u4E2A key\\uFF08\\u8FC7\\u4E8E\\u7E41\\u7410\\uFF09\\u3002Semi \\u5EF6\\u7EED\\u4E86\\u8FD9\\u4E2A\\u8BBE\\u5B9A\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u90A3\\u4E48\\u4E3A\\u4EC0\\u4E48\\u5728 Semi \\u4E2D \\u7528 label \\u800C\\u4E0D\\u662F value \\u5462\\uFF1F\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4EE5 value \\u8FD8\\u662F label \\u4F5C\\u4E3A\\u552F\\u4E00\\u5224\\u65AD\\u7B26\\uFF0C\", mdx(\"strong\", {\n    parentName: \"li\"\n  }, \"\\u672C\\u8D28\\u4E0A\\u662F \\u7528\\u6237\\u76F4\\u89C9 vs \\u7814\\u53D1\\u76F4\\u89C9 \\u7684\\u53D6\\u820D\"), \"\\u3002\\u4EE5 value \\u4E3A\\u552F\\u4E00\\u5224\\u65AD\\u6BD4\\u8F83\\u7B26\\u5408\\u5DE5\\u7A0B\\u5E08\\u76F4\\u89C9\\uFF0C\\u4F46\\u7AD9\\u5728\\u7528\\u6237\\u89C6\\u89D2\\u6765\\u770B\\uFF0C\\u4ED6\\u4EEC\\u80FD\\u770B\\u5230\\u7684\\u53EA\\u6709 label\\uFF0C\\u5BF9 value \\u57FA\\u672C\\u4E0A\\u662F\\u65E0\\u611F\\u77E5\\u7684\\u3002\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"label \\u662F\\u7528\\u6237\\u552F\\u4E00\\u80FD\\u611F\\u77E5\\u7684\\u5185\\u5BB9\\u3002\\u4ECE\\u4EA4\\u4E92\\u7684\\u89D2\\u5EA6\\u800C\\u8A00\\uFF0C\\u5982\\u679C\\u51FA\\u73B0\\u4E24\\u4E2A\\u6216\\u591A\\u4E2A\\u5C55\\u793A\\u4E0A\\u4E00\\u6A21\\u4E00\\u6837\\u7684\\u9009\\u9879\\uFF0C\\u5BF9\\u7528\\u6237\\u800C\\u8A00\\uFF0C\\u4ED6\\u4EEC\\u770B\\u4E0A\\u53BB\\u662F\\u4E00\\u6837\\u7684\\uFF0C\\u65E0\\u6CD5\\u8FDB\\u884C\\u533A\\u5206\\u3002\\u7528\\u6237\\u7B2C\\u4E00\\u53CD\\u5E94\\u5F80\\u5F80\\u662F\\u91CD\\u590D\\u4E86\\uFF0C\\u8FD9\\u4E2A\\u7CFB\\u7EDF\\u662F\\u4E0D\\u662F\\u51FA bug \\u4E86\\u3002\\u5176\\u6B21\\u5982\\u679C\\u4E24\\u4E2A option \\u5C55\\u793A\\u4E0A\\u4E00\\u6A21\\u4E00\\u6837\\uFF0C\\u4F46\\u9009\\u4E2D\\u7684\\u4F5C\\u7528\\u53C8\\u4E0D\\u4E00\\u6837\\uFF08\\u4F8B\\u5982\\u4E00\\u4E2A value \\u4E3A 0\\uFF0C\\u53E6\\u4E00\\u4E2A\\u4E3A 1\\uFF0C\\u4ED6\\u4EEC\\u7684\\u5904\\u7406\\u903B\\u8F91\\u5B8C\\u5168\\u4E0D\\u540C\\uFF09\\u7684\\u8BDD\\uFF0C\\u4E5F\\u4F1A\\u8BA9\\u7528\\u6237\\u975E\\u5E38\\u56F0\\u60D1\\u3002\\u5728\\u73B0\\u5B9E\\u751F\\u6D3B\\u7684\\u7EBF\\u4E0B\\u5B9E\\u4F53\\u8868\\u5355\\u91CC\\uFF0C\\u57FA\\u672C\\u4E0D\\u53EF\\u80FD\\u51FA\\u73B0\\u4E24\\u4E2A\\u4E00\\u6A21\\u4E00\\u6837\\u7684\\u9009\\u9879\\u3002\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5047\\u5982\\u6211\\u4EEC\\u4EE5 value \\u4F5C\\u4E3A\\u5224\\u65AD\\u7B26\\uFF0C\\u4EE5\\u4E0B\\u4F8B\\u5B50\\uFF0C\\u7528\\u6237\\u70B9\\u51FB\\u4E86 A \\u8FDB\\u884C\\u9009\\u4E2D\\uFF0C\\u5B9E\\u9645\\u4E0A\\u5374\\u770B\\u5230 A\\u3001B\\u3001C \\u90FD\\u88AB\\u540C\\u65F6\\u9009\\u4E2D\\u4E86\\u3002\\u540C\\u6837\\u4E5F\\u4F1A\\u975E\\u5E38\\u56F0\\u60D1\\uFF0C\\u7B2C\\u4E00\\u53CD\\u5E94\\u4E5F\\u5F80\\u5F80\\u662F\\u7CFB\\u7EDF\\u51FA bug \\u4E86\\u3002\", mdx(\"pre\", {\n    parentName: \"li\"\n  }, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"  <Select placeholder='choose your color'>\\n      <Option label='A' value='color' />\\n      <Option label='B' value='color' />\\n      <Option label='C' value='color' />\\n  </Select>\\n\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"label \\u552F\\u4E00\\u3001value \\u91CD\\u590D\\uFF0C\\u5728\\u65E5\\u5E38\\u4F7F\\u7528\\u4E2D\\u4F1A\\u66F4\\u4E3A\\u5E38\\u89C1\\u3002\\u4F8B\\u5982\\uFF0C\\u4E00\\u4E2A\\u6839\\u636E app \\u540D\\u79F0\\u9009\\u62E9\\u516C\\u53F8 id \\u7684\\u9009\\u62E9\\u5668\\uFF0Cvalue \\u662F app \\u5BF9\\u5E94\\u7684\\u516C\\u53F8 id\\uFF0Clabel \\u662F app \\u7684\\u540D\\u79F0\\u3002\", mdx(\"pre\", {\n    parentName: \"li\"\n  }, mdx(\"code\", {\n    parentName: \"pre\"\n  }, \"  <Select placeholder='choose company by app'>\\n    <Option label='vigo' value='bytedance' />\\n    <Option label='douyin' value='bytedance' />\\n  </Select>\\n\"))))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5206\\u7EC4\\u60C5\\u51B5\\u4E0B\\uFF0C\\u91CD\\u590D label \\u5E76\\u4E0D\\u4F1A\\u9020\\u6210\\u7528\\u6237\\u56F0\\u60D1\\u4E3A\\u4EC0\\u4E48\\u4ECD\\u8981\\u6C42 label \\u5FC5\\u987B\\u552F\\u4E00\\uFF1F\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u9009\\u62E9\\u9762\\u677F\\u6253\\u5F00\\u60C5\\u51B5\\u4E0B\\uFF0C\\u786E\\u5B9E\\u4E0D\\u4F1A\\u9020\\u6210\\u7528\\u6237\\u4F7F\\u7528\\u4E0A\\u7684\\u56F0\\u60D1\\uFF0C\\u4F46\\u662F\\u9009\\u62E9\\u9762\\u677F\\u6536\\u8D77\\u540E\\uFF0C\\u91CD\\u590D label \\u5C5E\\u4E8E\\u54EA\\u4E2A\\u5206\\u7EC4\\u5BF9\\u7528\\u6237\\u800C\\u8A00\\u4ECD\\u5177\\u6709\\u8FF7\\u60D1\\u6027\\u3002\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u6211\\u7684\\u6570\\u636E\\u91CC\\u786E\\u5B9E\\u5C31\\u6709\\u591A\\u4E2A label \\u4E00\\u6837\\u7684\\u9009\\u9879\\uFF0C\\u65E0\\u6CD5\\u907F\\u514D\\u3002\\u8FD9\\u4E2A\\u4EA4\\u4E92\\u80FD\\u7ED5\\u8FC7\\u5417\\uFF1F\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u53EF\\u4EE5\\u3002\\u6211\\u4EEC\\u4E0D\\u63A8\\u8350\\u5411\\u7528\\u6237\\u5C55\\u793A\\u91CD\\u590D\\u7684 label option\\uFF0C\\u4F46\\u5982\\u679C\\u4F60\\u786E\\u5B9A\\u4F60\\u9700\\u8981\\u8FD9\\u4E48\\u505A\\uFF0C\\u5F53\\u4F60\\u5F80 label \\u4F20\\u5165 ReactNode \\u7C7B\\u578B\\u65F6\\uFF0C\\u53EF\\u4EE5\\u7ED5\\u8FC7\\u8FD9\\u4E2A\\u9650\\u5236\\u3002\"))))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u53EF\\u641C\\u7D22\\u7684 Select\\uFF0C\\u4F7F\\u7528\\u8FDC\\u7A0B\\u6570\\u636E\\u52A8\\u6001\\u66F4\\u65B0\", mdx(\"inlineCode\", {\n    parentName: \"strong\"\n  }, \"optionList\"), \"\\uFF0C\\u4E3A\\u4EC0\\u4E48\\u5728\\u5F02\\u6B65\\u8BF7\\u6C42\\u5B8C\\u6210\\u4E4B\\u524D\\u6709\\u65F6\\u5019\\u4F1A\\u51FA\\u73B0\\u6682\\u65E0\\u6570\\u636E\\uFF1F\"), mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u8BF7\\u68C0\\u67E5\\u662F\\u5426\\u8BBE\\u7F6E\\u4E86\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"remote={true}\"), \"\\uFF0C\\u4E0D\\u8BBE\\u7F6E remote \\u7684\\u60C5\\u51B5\\u4E0B\\uFF0C\\u9ED8\\u8BA4\\u4F1A\\u5C06 input \\u6846\\u8F93\\u5165\\u503C\\u4E0E\\u5F53\\u524D\\u7684 optionList \\u8FDB\\u884C\\u4E00\\u6B21\\u5BF9\\u6BD4\\u7B5B\\u9009\\uFF0C\\u5982\\u679C\\u65E0\\u5339\\u914D\\u65F6\\uFF0C\\u5C31\\u4F1A\\u663E\\u793A\\u6682\\u65E0\\u6570\\u636E\\u3002\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u53EF\\u4EE5\\u901A\\u8FC7\\u8BBE\\u7F6E remote \\u4E3A true \\u5173\\u95ED\\u5BF9\\u672C\\u5730\\u5F53\\u524D\\u6570\\u636E\\u7684\\u5339\\u914D\\u7B5B\\u9009\\u3002\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u4F7F\\u7528 jsx \\u65B9\\u5F0F\\u58F0\\u660E Option\\uFF0Clabel \\u4E3A i18n \\u540E\\u7684\\u5185\\u5BB9\\uFF0C\\u5207\\u6362 locale \\u540E\\u672A\\u80FD\\u91CD\\u65B0\\u6E32\\u67D3\")), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"children jsx \\u65B9\\u5F0F\\u58F0\\u660E Options \\u65F6\\uFF0C\\u7531\\u4E8E\\u662F ReactNode\\uFF0C\\u4E0D\\u53EF\\u80FD\\u7528 deepEqual \\u6765\\u505A\\u5BF9\\u6BD4\\u5224\\u65AD\\u5185\\u5BB9\\u662F\\u5426\\u6709\\u66F4\\u65B0\\uFF08\\u6027\\u80FD\\u6D88\\u8017\\u8FC7\\u5927\\uFF09\\uFF0C\\u6240\\u4EE5\\u4F1A\\u6536\\u96C6 children ReactNode \\u7684 key\\uFF0C\\u5F53 key \\u4E0D\\u53D8\\u65F6\\uFF0C\\u5C31\\u8BA4\\u4E3A Options \\u90FD\\u6CA1\\u6709\\u53D1\\u751F\\u53D8\\u5316\\uFF0C\\u4E0D\\u4F1A\\u8D70\\u91CD\\u65B0\\u6536\\u96C6\\u6570\\u636E\\u7684\\u6D41\\u7A0B\\u3002\\u4F60\\u53EF\\u4EE5\\u5C06 locale \\u4E5F\\u4F5C\\u4E3A Option key \\u7684\\u4E00\\u90E8\\u5206\\u3002\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4F7F\\u7528 optionList \\u65B9\\u5F0F\\u4F20\\u5165\\uFF0C\\u4E5F\\u53EF\\u4EE5\\u89E3\\u51B3\\u95EE\\u9898\\u3002\\u56E0\\u4E3A\\u5BF9\\u4E8E object \\u5F62\\u5F0F\\u4F20\\u5165\\uFF0Ckey \\u76F8\\u5BF9\\u6709\\u9650\\uFF0CSelect \\u5185\\u90E8\\u4F1A\\u4F7F\\u7528 isEqual \\u6765\\u5224\\u65AD\\u662F\\u5426\\u53D1\\u751F\\u53D8\\u5316\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u4F7F\\u7528 jsx \\u65B9\\u5F0F\\u58F0\\u660E Option\\uFF0C\\u52A8\\u6001\\u5207\\u6362 disabled \\u5C5E\\u6027\\u540E\\u672A\\u80FD\\u91CD\\u65B0\\u6E32\\u67D3\")), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u539F\\u56E0\\u540C\\u4E0A\\uFF0C\\u4F60\\u53EF\\u4EE5\\u91CD\\u65B0\\u7ED9 Option \\u8BBE\\u5B9A\\u4E0D\\u540C\\u7684 key \\u503C\\uFF0C\\u6216\\u8005\\u4F7F\\u7528 optionList \\u65B9\\u5F0F\\u58F0\\u660E\\u5019\\u9009\\u9879\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Select \\u4F1A\\u81EA\\u52A8\\u9650\\u5236\\u4E0B\\u62C9\\u83DC\\u5355\\u7684\\u5BBD\\u5EA6\\u5417\\uFF1F\")), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u4F1A\\u7ED9 minWidth\\uFF0C\\u4F46\\u4E0D\\u4F1A\\u5199\\u6B7B width\\u3002\\u5982\\u679C\\u6709\\u9700\\u8981\\u7684\\u8BDD\\uFF0C\\u53EF\\u4EE5\\u81EA\\u5DF1\\u901A\\u8FC7 dropdownStyle \\u6765\\u6DFB\\u52A0\\u3002\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u8BBE\\u7F6E allowCreate \\u540E\\uFF0C\\u52A8\\u6001\\u66F4\\u65B0 optionList \\u6216\\u8005 children \\u4E0D\\u751F\\u6548\")), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"allowCreate \\u4E3B\\u8981\\u7528\\u4E8E\\u672C\\u5730\\u521B\\u5EFA\\u7684\\u573A\\u666F\\uFF0C\\u5F00\\u542F\\u8BE5\\u9879\\u540E\\uFF0C\\u76F8\\u5F53\\u4E8E\\u5F3A\\u63A5\\u7BA1\\u4E86 optionList / children\\uFF0C\\u4E0D\\u4F1A\\u518D\\u54CD\\u5E94\\u5916\\u90E8\\u5BF9\\u8FD9\\u4E24\\u7C7B\\u503C\\u7684\\u66F4\\u65B0\\u3002\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u4E3A\\u4EC0\\u4E48\\u5355\\u9009\\u9009\\u62E9\\u9009\\u9879\\u540E\\u6CA1\\u6709\\u89E6\\u53D1 blur \\u4E8B\\u4EF6\\uFF1F\")), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5728 V2.17.0 \\u524D\\uFF0CSelect \\u5355\\u9009\\u9009\\u62E9\\u540E\\uFF0C\\u4F1A\\u89E6\\u53D1 Select \\u7684 blur \\u4E8B\\u4EF6\\u3002\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5728 V2.17.0 \\u540E\\uFF0CSelect \\u589E\\u52A0\\u4E86 A11y \\u652F\\u6301\\uFF0C\\u4E0D\\u4F1A\\u89E6\\u53D1 Select \\u7684 blur \\u4E8B\\u4EF6\\u3002\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u5355\\u9009\\u9009\\u62E9\\u4E2D\\uFF0CSelect \\u6D6E\\u5C42\\u5173\\u95ED\\uFF0C\\u4F9D\\u7136\\u4FDD\\u6301\\u7126\\u70B9\\u5728 trigger\\uFF08\\u6B64\\u65F6\\u53EF\\u4EE5\\u901A\\u8FC7 Enter \\u56DE\\u8F66\\u952E\\u518D\\u6B21\\u6253\\u5F00 Select \\u6D6E\\u5C42\\uFF09\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u65E0\\u8BBA\\u5355\\u9009\\u6216\\u591A\\u9009\\uFF0C\\u6309\\u4E0B Esc\\uFF0C\\u4EC5 Select \\u6D6E\\u5C42\\u5173\\u95ED\\uFF0Ctrigger \\u4FDD\\u6301\\u7126\\u70B9\\uFF08\\u6B64\\u65F6\\u53EF\\u4EE5\\u901A\\u8FC7 Enter \\u56DE\\u8F66\\u952E\\u518D\\u6B21\\u6253\\u5F00 Select \\u6D6E\\u5C42\\uFF09\"))))))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u76F8\\u5173\\u7269\\u6599\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"semi-material-list\", {\n    code: \"3, 4, 58, 62, 696\"\n  }))));\n}\n;\nMDXContent.isMDXComponent = true;"}},"pageContext":{"slug":"zh-CN/input/select","next":{"fields":{"slug":"en-US/input/slider"},"id":"ad9ac99a-5fcd-5a2e-a84c-6df92cfbeb23","frontmatter":{"title":"Slider","localeCode":"en-US","icon":"doc-slider","showNew":null}},"previous":{"fields":{"slug":"en-US/input/select"},"id":"afbb90f7-7c16-5056-a783-27d592fbb8f0","frontmatter":{"title":"Select","localeCode":"en-US","icon":"doc-select","showNew":null}}}},"staticQueryHashes":["1348983216108720","1477422646108720","3245198693108720","417590761108720","63159454108720"]}