修正SegmentControl解析Map格式的默认值。
This commit is contained in:
parent
4b4428fd3b
commit
6dba92a2c5
|
@ -5,6 +5,8 @@ import type { Option } from '../models';
|
||||||
import styles from './HSegmentedControl.module.css';
|
import styles from './HSegmentedControl.module.css';
|
||||||
|
|
||||||
type HSegmentedControlProps = {
|
type HSegmentedControlProps = {
|
||||||
|
name?: string;
|
||||||
|
defaultValue?: Option['value'];
|
||||||
options?: Option[];
|
options?: Option[];
|
||||||
value?: Option['value'];
|
value?: Option['value'];
|
||||||
onChange?: (value: Option['value']) => void;
|
onChange?: (value: Option['value']) => void;
|
||||||
|
@ -12,12 +14,19 @@ type HSegmentedControlProps = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export function HSegmentedControl({
|
export function HSegmentedControl({
|
||||||
|
name,
|
||||||
|
defaultValue,
|
||||||
options = [],
|
options = [],
|
||||||
value,
|
value,
|
||||||
onChange,
|
onChange,
|
||||||
extendClassName,
|
extendClassName,
|
||||||
}: HSegmentedControlProps) {
|
}: HSegmentedControlProps) {
|
||||||
const [selected, setSelected] = useState(value ?? options[0].value ?? null);
|
const [selected, setSelected] = useState(
|
||||||
|
value ??
|
||||||
|
defaultValue ??
|
||||||
|
(isMap(options[0]) ? options[0].get('value') : options[0].value) ??
|
||||||
|
null,
|
||||||
|
);
|
||||||
const [sliderPosition, setSliderPosition] = useState(0);
|
const [sliderPosition, setSliderPosition] = useState(0);
|
||||||
const [sliderWidth, setSliderWidth] = useState(0);
|
const [sliderWidth, setSliderWidth] = useState(0);
|
||||||
const sliderRef = useRef<HTMLDivElement>(null);
|
const sliderRef = useRef<HTMLDivElement>(null);
|
||||||
|
@ -57,6 +66,7 @@ export function HSegmentedControl({
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
{!isNil(name) && <input type="hidden" name={name} value={selected} />}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,6 +5,8 @@ import type { Option } from '../models';
|
||||||
import styles from './VSegmentedControl.module.css';
|
import styles from './VSegmentedControl.module.css';
|
||||||
|
|
||||||
type VSegmentedControlProps = {
|
type VSegmentedControlProps = {
|
||||||
|
name?: string;
|
||||||
|
defaultValue?: Option['value'];
|
||||||
options?: Option[];
|
options?: Option[];
|
||||||
value?: Option['value'];
|
value?: Option['value'];
|
||||||
onChange?: (value: Option['value']) => void;
|
onChange?: (value: Option['value']) => void;
|
||||||
|
@ -12,12 +14,19 @@ type VSegmentedControlProps = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export function VSegmentedControl({
|
export function VSegmentedControl({
|
||||||
|
name,
|
||||||
|
defaultValue,
|
||||||
options = [],
|
options = [],
|
||||||
value,
|
value,
|
||||||
onChange,
|
onChange,
|
||||||
extendClassName,
|
extendClassName,
|
||||||
}: VSegmentedControlProps) {
|
}: VSegmentedControlProps) {
|
||||||
const [selected, setSelected] = useState(value ?? options[0].value ?? null);
|
const [selected, setSelected] = useState(
|
||||||
|
value ??
|
||||||
|
defaultValue ??
|
||||||
|
(isMap(options[0]) ? options[0].get('value') : options[0].value) ??
|
||||||
|
null,
|
||||||
|
);
|
||||||
const [sliderPosition, setSliderPosition] = useState(0);
|
const [sliderPosition, setSliderPosition] = useState(0);
|
||||||
const [sliderHeight, setSliderHeight] = useState(0);
|
const [sliderHeight, setSliderHeight] = useState(0);
|
||||||
const sliderRef = useRef<HTMLDivElement>(null);
|
const sliderRef = useRef<HTMLDivElement>(null);
|
||||||
|
@ -57,6 +66,7 @@ export function VSegmentedControl({
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
{!isNil(name) && <input type="hidden" name={name} value={selected} />}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user