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();
  }, []);
相关推荐
今天不要写bug5 分钟前
基于qrcode前端实现链接转二维码的生成与下载
前端·javascript·typescript·vue
JIngJaneIL23 分钟前
基于Java + vue干洗店预约洗衣系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot
搬山境KL攻城狮24 分钟前
记-SPA单页面应用Chrome自动翻译导致中文错别字问题
前端·chrome
HIT_Weston33 分钟前
61、【Ubuntu】【Gitlab】拉出内网 Web 服务:Gitlab 配置审视(五)
前端·ubuntu·gitlab
旺仔Sec1 小时前
2026年度河北省职业院校技能竞赛“Web技术”(高职组)赛项竞赛任务
运维·服务器·前端
用户4099322502121 小时前
Vue的Class绑定对象语法如何让动态类名切换变得直观高效?
前端·ai编程·trae
GIS之路1 小时前
GIS 数据转换:GDAL 实现将 CSV 转换为 Shp 数据(一)
前端
武清伯MVP2 小时前
深入了解Canvas:HTML5时代的绘图利器(一)
前端·html5·canvas
一水鉴天2 小时前
整体设计 定稿 之24 dashboard.html 增加三层次动态记录体系仪表盘 之2 程序 (Q208 之1)
前端·html
_杨瀚博2 小时前
微信支付集成_JSAPI
前端