TypeScript+React中切换排序方向状态时类型不匹配问题求助

针对你遇到的number类型无法赋值给1 | -1联合类型的问题，这里提供几种可行的解决方法：

方法一：使用条件判断替代乘法（推荐） #

直接通过判断当前值来切换，TypeScript能自动推导结果类型，无需额外处理：

setSortDirection(prev => prev === 1 ? -1 : 1);

方法二：类型断言 #

如果你偏好乘法的写法，可以通过类型断言告诉TypeScript运算结果必然是1或-1：

// 直接更新
setSortDirection((sortDirection * -1) as 1 | -1);

// 函数式更新（更安全，避免闭包问题）
setSortDirection(prev => (prev * -1) as 1 | -1);

方法三：改用布尔类型状态（更直观） #

放弃1 | -1的联合类型，用布尔值表示升降序状态，在需要数值的地方再转换：

1. 定义状态：

const [isAscending, setIsAscending] = useState(true);

2. 切换状态：

setIsAscending(prev => !prev);

3. 获取排序方向数值：

const sortDirection = isAscending ? 1 : -1;

这种方式逻辑更清晰，可读性更强，也不会有类型匹配问题。

内容的提问来源于stack exchange，提问作者elihpoivulp