Skip to content

Commit a7db356

Browse files
刘欢claude
andcommitted
fix: fix TypeScript type errors in disabled-handle example
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent bedc645 commit a7db356

File tree

1 file changed

+6
-6
lines changed

1 file changed

+6
-6
lines changed

docs/examples/disabled-handle.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,12 @@ const style: React.CSSProperties = {
99
};
1010

1111
const BasicDisabledHandle = () => {
12-
const [value, setValue] = useState([0, 30, 60, 100]);
12+
const [value, setValue] = useState<number[]>([0, 30, 60, 100]);
1313
const [disabled, setDisabled] = useState([true, false, false, true]);
1414

1515
return (
1616
<div>
17-
<Slider range value={value} onChange={setValue} disabled={disabled} />
17+
<Slider range value={value} onChange={(v) => setValue(v as number[])} disabled={disabled} />
1818
<div style={{ marginTop: 16 }}>
1919
{value.map((val, index) => (
2020
<label key={index} style={{ marginRight: 16 }}>
@@ -36,11 +36,11 @@ const BasicDisabledHandle = () => {
3636
};
3737

3838
const DisabledHandleAsBoundary = () => {
39-
const [value, setValue] = useState([10, 50, 90]);
39+
const [value, setValue] = useState<number[]>([10, 50, 90]);
4040

4141
return (
4242
<div>
43-
<Slider range value={value} onChange={setValue} disabled={[false, true, false]} />
43+
<Slider range value={value} onChange={(v) => setValue(v as number[])} disabled={[false, true, false]} />
4444
<p style={{ marginTop: 8, color: '#999' }}>
4545
Middle handle (50) is disabled and acts as a boundary.
4646
First handle cannot go beyond 50, third handle cannot go below 50.
@@ -51,11 +51,11 @@ const DisabledHandleAsBoundary = () => {
5151
};
5252

5353
const MultipleDisabledBoundaries = () => {
54-
const [value, setValue] = useState([10, 30, 50, 70, 90]);
54+
const [value, setValue] = useState<number[]>([10, 30, 50, 70, 90]);
5555

5656
return (
5757
<div>
58-
<Slider range value={value} onChange={setValue} disabled={[true, false, true, false, true]} />
58+
<Slider range value={value} onChange={(v) => setValue(v as number[])} disabled={[true, false, true, false, true]} />
5959
<p style={{ marginTop: 8, color: '#999' }}>
6060
Handles at 10, 50, 90 are disabled.
6161
Handle at 30 can only move between 10-50, handle at 70 can only move between 50-90.

0 commit comments

Comments
 (0)