类型“未知 []”缺少“初始状态”类型的以下属性

Posted 2023-04-14

【中文标题】类型“未知 []”缺少“初始状态”类型的以下属性

【英文标题】：Type 'unknown[]' is missing the following properties from type 'InitialState'

【发布时间】：2021-12-26 01:31:57

【问题描述】：

想弄清楚如何将类型传递给值？

<Context.Provider value=[state, dispatch]>children 
</Context.Provider>

类型“unknown[]”缺少类型“InitialState”的以下属性：navigateTo、user、avatar、dashBoardSelectedMenuItemts(2739) index.d.ts(338, 9)：预期类型来自属性“值”，该属性在此处声明为类型“IntrinsicAttributes & ProviderProps” (JSX 属性) React.ProviderProps.value: InitialState

import React,  createContext  from "react";
import Reducer from "./reducer";

interface InitialState 
  navigateTo: string;
  user: string;
  avatar: string;
  dashBoardSelectedMenuItem: string;


const initialState: InitialState = 
  navigateTo: "dashboard",
  user: null,
  avatar: null,
  dashBoardSelectedMenuItem: "dashboard",
;
export const Context = createContext<InitialState>(initialState);

const Store = ( children ) => 
  const [state, dispatch] = React.useReducer<any>(Reducer, initialState);

  return (
    <Context.Provider value=[state, dispatch]>children</Context.Provider>
  );
;

export default Store;

感谢收看。

【参考方案1】：

试试这个

import React,  createContext  from "react";
import Reducer from "./reducer";

export default function App() 
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );


interface InitialState 
  navigateTo: string;
  user: string | null;
  avatar: string | null;
  dashBoardSelectedMenuItem: string;


const initialState: InitialState = 
  navigateTo: "dashboard",
  user: null,
  avatar: null,
  dashBoardSelectedMenuItem: "dashboard"
;

export const Context = createContext<[InitialState, React.Dispatch<any>]>([
  initialState,
  () => 
]);

const Store = ( children ) => 
  const [state, dispatch] = React.useReducer(Reducer, initialState);

  return (
    <Context.Provider value=[state, dispatch]>children</Context.Provider>
  );
;

export default Store;

在你的 reducer 中添加如下状态的类型信息

export const Reducer = (state: InitialState, action:any): InitialState => 
  switch (action.type) 
    ...
    ...
  

【讨论】：

您已关闭错误现在已移至“状态”而不是值...类型“”缺少类型“初始状态”中的以下属性：navigateTo、用户、头像、dashBoardSelectedMenuItem

@fuzzybear，更新了答案

与@shankar 的评论一起使用，从 usereducer 中删除了任何内容

以最接近的方式接受您的答案不需要减速器代码，请在下面注明@shankar upadhyay。

【参考方案2】：

让我试着帮助你。

在这里，您已将初始状态中的类型 os 用户和头像定义为字符串，您应该仅将字符串作为值传递。

也许您传递的是 null 而不是空字符串“” 可以解决类型问题。

typeof null 是 Object。

const initialState: InitialState = navigateTo: "dashboard", user: "", avatar: "", dashBoardSelectedMenuItem: "dashboard", ;

类似问题可以访问此链接Using react context with react hooks in typescript

【讨论】：

您好，将值更改为空字符串后，值仍然在抱怨 type unknown[] is missing the ... ，和之前一样，感谢您的尝试。

嗨，尝试 value=[initialState:state, dispatch]>

createContext]> 如果没有目的，您可以在删除数组后尝试 createContext>

与上面的@Amila Senadheera 答案结合使用