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();
  }, []);
相关推荐
Mr_Mao7 小时前
告别选型困难!集 VueUse、ahooks、Mantine 于一身:286 个 Hook 的 ReaUse 来了
前端·javascript·react.js
智鸟科技GemeOpen开发者智能设备7 小时前
智能插座二次开发如何接入Home Assistant,从零开始完整工程实现(Python+React)
开发语言·python·物联网·react.js·智能家居
泡海椒7 小时前
趋势分析报表:jquick-pdf折线图PDF生成实战
java·大数据·运维·服务器·前端·pdf
默_笙8 小时前
🚙 一条腿走路会摔:ES 关键词检索、混合召回与 ReRank 裁判
前端·javascript
YIAN8 小时前
从跨域代理到 WebSocket:梳理前端实时通信的底层逻辑与完整实践
前端·websocket
一曲终散8 小时前
创建 SVG 图标预览页面:从零实现到解决 CORS 问题
前端
静默回滚8 小时前
iPhone照片电脑上打不开:HEIC解码从原理到WASM
前端
dsyyyyy11018 小时前
Vue 3 Watch 监视完全指南
前端·javascript·vue.js
航飞光电市场经理8 小时前
人员定位系统“全栈自研”技术解析:从射频前端到定位引擎的架构拆解
前端·架构
Apifox9 小时前
Apifox 9 月更新|CLI 能力升级、GitLab 私有化部署接入与产品体验优化
前端·后端·测试