Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 | 1x 1x 5x 5x 2x 5x 1x 12x 12x 12x 12x 34x 2x 2x 2x 5x 33x | import React from "react"; import classNames from "classnames"; import { useTranslation } from "../i18n"; import { useDefaultValue } from "../form"; import { useConfig } from "../_util/config-context"; import { SelectProps } from "./SelectProps"; import { SelectOptionWithGroup } from "./SelectOption"; function groupBy(options: SelectOptionWithGroup[]): SelectOptionWithGroup[][] { const groups = []; options.forEach((opt, index) => { const { groupKey } = opt; if (index === 0 || groupKey !== options[index - 1].groupKey) { groups.push([]); } groups[groups.length - 1].push(opt); }); return groups; } /** * 原生 Select */ export function NativeSelect(props: SelectProps) { const t = useTranslation(); const { classPrefix } = useConfig(); const { value, onChange, options = [], groups = {}, placeholder = t.pleaseSelect, disabled, size, className, style, } = useDefaultValue(props, null); return ( <select className={classNames(`${classPrefix}-select`, className, { [`size-${ size === "full" || size === "auto" ? `${size}-width` : size }`]: size, })} style={style} disabled={disabled} value={value != null ? value : ""} placeholder={placeholder} onChange={ disabled ? null : event => onChange(event.target.value, { event }) } > {typeof placeholder === "string" && ( <option disabled={!!value} hidden> {placeholder} </option> )} {options.find(opt => !!opt.groupKey) ? groupBy(options).map(group => { const { value, groupKey } = group[0]; Iif (!groupKey) { return group.map(opt => ( <option key={opt.value} value={opt.value} disabled={opt.disabled} title={ typeof opt.tooltip === "string" ? opt.tooltip : undefined } > {typeof opt.text === "undefined" ? opt.value : opt.text} </option> )); } return ( <optgroup key={value} label={(groups[groupKey] as string) || ""}> {group.map(opt => ( <option key={opt.value} value={opt.value} disabled={opt.disabled} title={ typeof opt.tooltip === "string" ? opt.tooltip : undefined } > {typeof opt.text === "undefined" ? opt.value : opt.text} </option> ))} </optgroup> ); }) : options.map(opt => ( <option key={opt.value} value={opt.value} disabled={opt.disabled} title={typeof opt.tooltip === "string" ? opt.tooltip : undefined} > {typeof opt.text === "undefined" ? opt.value : opt.text} </option> ))} </select> ); } |