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();
  }, []);
相关推荐
深海鱼在掘金2 分钟前
Next.js从入门到实战保姆级教程(第三章):项目结构与文件系统约定
前端·typescript·next.js
水木流年追梦7 分钟前
CodeTop Top 300 热门题目3-字符串相加
java·前端·算法
编码七号7 分钟前
使用playwright做前端项目的端对端自动化测试
前端·功能测试·自动化
禅思院9 分钟前
中篇:构建弹性的异步组件
前端·架构·前端框架
夜影风9 分钟前
Nginx部署Vue/React项目时无法直接访问页面其他路径的问题及解决方案
vue.js·nginx·react.js
恋猫de小郭14 分钟前
为什么 Github Copilot 要收集你数据,也是 AI 订阅以前便宜的原因
前端·人工智能·ai编程
我叫唧唧波14 分钟前
【自动化部署】CI/CD 实战(三):让 Argo CD 接管 CD,Jenkins 镜像自动同步到集群
运维·前端·ci/cd·docker·自动化·jenkins·argocd
ZC跨境爬虫15 分钟前
UI前端美化技能提升日志day1:矢量图片规范与自适应控制栏实战
前端·css·ui·状态模式
朱穆朗18 分钟前
Cmder创建npm等项目中,使用CLI的BUG
前端·npm·bug
Z_Wonderful19 分钟前
实现图片拖动、鼠标中心点缩放、文字层跟随功能
前端·javascript·计算机外设