Question

属性“value”在 Readonly 类型上不存在

2018-02-19

34683

reactjs typescript

我正在学习如何使用 React 作为前端并使用 spring 作为后端来开发应用程序。在开发示例应用程序时，我遇到了以下错误：

       `(26,28): Property "value" does not exist on type 'Readonly<{}>`

此错误是由我的 App.tsx 文件生成的，该文件包含 JSX 中的 React Components 定义。具有状态“value”的类组件定义如下。

class App extends React.component{
        constructor(props:any) {
             super(props);
             this.state = {
             value:[],
             isLoading:false
          };
       }
        ...
25      render(){
26        const value = this.state.value;
27        const isLoading = this.state.isLoading;
          ... 
    }
   }//End of Class*

我不明白哪里出了问题。有人能帮我从不同的角度看待这个问题吗，以便可以用不同的方式解决这个问题？

Answer 1

您是否为 state 声明了一个接口？

查看 Hello React and TypeScript ，其中展示了使用 React Components 接口的示例。

我怀疑您遗漏了这样的东西：

interface IMyComponentProps {
    someDefaultValue: string
}

interface IMyComponentState {
    someValue: string
}

class App extends React.Component<IMyComponentProps, IMyComponentState> {
  // ...
}

Answer 2

请您按照以下步骤尝试。

class App extends React.component<{},any>{ //your code}

Kelum Sampath Edirisinghe

2020-04-27

Answer 3

    export default class ReactTodoWebpart extends React.Component<IReactTodoWebpartProps,any> {
  /**
   *
   */
  constructor(props:IReactTodoWebpartProps) {
    super(props);
    this.state={
      todoItems:[]
    };
    this.props.todoClient.getItems().then(resolvedItems=>{
      this.setState({
        todoItems: resolvedItems,

      })
    });

  }
// I also face this issue and fixed it by using any in the second argument