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();
  }, []);
相关推荐
lantian21 小时前
TypeScript 模块系统核心原理:从ESM到CJS,彻底搞懂模块格式与解析逻辑
前端·typescript·ecmascript 6
Lear21 小时前
CSR、SSR、SSG 到底怎么选?一文讲透现代前端三大渲染模式
前端
এ慕ོ冬℘゜21 小时前
前端分页组件完整实现:样式 + 交互 + 逻辑全优化
前端·交互
Ajie'Blog21 小时前
Claude Opus 4.8 发布:Claude Code 能不能接住复杂项目
服务器·前端·javascript·人工智能·ai编程
San813_LDD21 小时前
[后端开发]GET/POST_带参/不带参
前端·后端·计算机网络·json
不爱吃糖的程序媛21 小时前
React Native 应用适配鸿蒙PC 实战:从白屏到成功运行
react native·react.js·harmonyos
问心无愧051321 小时前
ctf show web入门101
android·前端·笔记
AI周红伟21 小时前
事件分析:FDE标准,“OpenClaw+RAG+Agent” 应用实战的标准
前端·人工智能·chrome·chatgpt·aigc
Mike_jia21 小时前
Databasus:开源数据库备份革命的里程碑,企业级数据安全的守护神
前端
恋猫de小郭21 小时前
真正的跨平台 AI 自动化框架,甚至还支持鸿蒙
android·前端·flutter