属性在 Readonly { } 类型上不存在

Question

我收到以下错误：

“'Readonly<{}>' 类型不存在属性 'items'。” 和“属性 'value' 在类型 'Readonly<{}>' 上不存在。”

我正在尝试创建“添加评论，您可以在其中投票和投票”。此外，当我刷新页面时，添加的项目不再可用。

以下代码使用带有打字稿的 React：

Abc.tsx:


  export default class Abc extends React.Component{

constructor{

}
handleChange(event){

}

addItem(){

  })
  this.setState({items:itemsCopy, value:''});
}




 render(){
   return(
    <div>
      <input value={this.state.value} onChange={this.handleChange.bind(this)} />
      <button onClick = {() => this.addItem()}>Submit</button>
      <PostList postList = {this.state.items} 
                updateScore = {this.updateScore.bind(this)}
                removeItem = {this.removeItem.bind(this)}/>
    </div>
  );
  }
}

Answer 1

要回答问题的第一部分，您需要明确定义组件状态的类型。你可以通过为它编写一个接口来做到这一点。

interface AbcState {
  items: any[]; //replace any with suitable type
  value: string;
}

export default class Abc extends React.Component<{}, AbcState> {
 // the rest

}

至于数据不被持久化的问题，本地组件状态不会存储任何超出其生命周期的数据。您可以将数据保存在数据库中，也可以将其缓存在本地存储中。