react 中解决 类型“never”上不存在属性“value”。

在 React 中,当你使用 useState 钩子来管理状态时,TypeScript 会尝试推断你的状态变量的类型。在你的例子中,listchannel 被初始化为一个空数组,因此 TypeScript 推断出 listchannel 的类型是 never[],即一个空数组类型。

由于 never[] 类型的数组没有任何属性,所以当你尝试访问 listchannel[1].value 时,TypeScript 会报错,因为 never 类型上不存在任何属性。

要解决这个问题,你需要明确地告诉 TypeScript listchannel 数组中元素的类型。你可以定义一个接口来描述这些对象,然后将这个接口作为 useState 的泛型参数。

解决办法

复制代码
//给这个数组定义类型
interface Channel {
  value: number;
  label: string;
}


const [listchannel, setListchannel] = useState<Channel []>([]);




  useEffect(() => {
    async function getListchannel() {
      const res = await Listchannel();
      const res1 = res.data.channels.map((item:any) => {
        return { value: item.id, label: item.name };
      });
      setListchannel(res1);
    }
    getListchannel();
  }, []);
相关推荐
Mintopia7 分钟前
🚀 Next.js 全栈 E2E 测试:Playwright vs Cypress
前端·javascript·next.js
原生高钙7 分钟前
JS设计模式指南
前端·javascript
拳打南山敬老院10 分钟前
漫谈 MCP 构建之Resources篇
前端·后端·ai编程
golang学习记12 分钟前
从0死磕全栈第九天:Trae AI IDE一把梭,使用react-query快速打通前后端接口调试
前端
超人92113 分钟前
我用纯前端技术打造了一个开发者工具箱,10+实用工具助力提效!
前端
bug_kada14 分钟前
详解 React useCallback & useMemo
前端·react.js
Mintopia14 分钟前
⚡ WebAssembly 如何加速 AIGC 模型在浏览器中的运行效率?
前端·javascript·aigc
AAA_Tj15 分钟前
前端动画技术全景指南:四大动画技术介绍
前端
断竿散人20 分钟前
乾坤微前端框架的沙箱技术实现原理深度解析
前端·javascript·前端框架
用户7847215099121 分钟前
Zustand源码解读(更新中)
react.js