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();
  }, []);
相关推荐
A小码哥8 小时前
大模型成本怎么降,5 个动作先做前两个
java·前端·spring
PHP是世界上最好的语言8 小时前
React接入PDF批注:保存后重新打开,确认改动没有丢
react.js
PHP是世界上最好的语言8 小时前
ComPDF预览本地正常,部署后白屏:检查资源、路径和许可
前端
kiros_wang8 小时前
项目分包方案:模块拆分、跨模块组件与方法引用规范
前端
PedroQue998 小时前
unix-utils v0.2.0 发布:modal 全端统一,自绘窗口解决输入框难题
前端·uni-app
Csvn8 小时前
网络优化
前端
代码猎人8 小时前
前端怎么跟进生态新技术
前端
海阳皓辰网络科技有限公司8 小时前
Vue3 冷库货位选择器:三级联动、扫码带出与批次混放校验
前端·vue.js
__sjfzllv___8 小时前
在职前端Leader学习/转行 AI Agent -DAY81
前端
女生也可以敲代码8 小时前
div上有红色下划线报错:JSX 元素隐式具有类型 “any“,因为不存在接口 “JSX.IntrinsicElements“。ts(7026)
前端