私はこのいくつかの方法を試してみたが、私はこのエラーを取り除くように見えるカントReactJSと地図機能

Question

を使用してのListItemの地図。この関数はうまく動作し、ブラウザで問題なくレンダリングされますが、ボタンのクリック方法に不満があります。

は、私は単にその後、私の方法では、私は状態オブジェクトのうち配列を作成状態をマッピングし、私の出力

this.setState({divs: [...this.state.divs, {title: this.state.newTitle, 
description: this.state.newDescription, time: timeNow, date: dateNow}]}); 

に戻しています。

renderTheDiv =() => { 

    var panelMap = [div]; 

    const newGeneratedPanel = panelMap.map((data, x) => 
      <div id="newpanel" className="panel" key={x}> 
      <label>Created:&nbsp;</label> 
      <span className="date">{data.date}</span> at 
      <span className="date">{data.time}</span> 
      <div className="itemTitle">{data.title}</div> 
      <br/> 
      <div className="itemDescription">{data.description}</div> 
      <button type="button" 
      className="editButton btn btn-default">Edit</button>&nbsp; 
      <button type="button" className="deleteButton btn btn-danger" 
      onClick={this.delete()}>Delete</button> 
      <div id="updated"></div></div>); 

     return newGeneratedPanel; 

    } 

は、私が使用してそれを返すようにしようとしました：

return newGeneratedPanel; 

をそして、これは誤りです：

とも

return (<div>{newGeneratedPanel}</div>); // this one generates an 
     error complaining about needing a key even though it is clearly set 

そして、これがありますエラー：

は、私が使用して私のレンダリング機能でそれを呼び出す：{this.state.divs.map(this.renderDivs)}

パネルのdivが表示されていない問題にし、正常に動作しますが、エラーはまだ私のコンソールに持続します。私はそれを無視したくない。スタック上の誰かが、両方の返されたメソッドで正常に機能していても、このエラーを取り除く方法を特定するのを助けてくれることを願っています。

これについての助けがあれば幸いです。私はエラーを取り除くためにさまざまな方法を試しましたが、役に立たなかったのです。

Answer 1

1. あなたのコードでは、あなたのケースでは、戻り値this.delete()の関数である必要があります。かっこを削除します。 ... onClick={this.delete}

2. this.renderDivsの機能はどこですか？