前提・実現したいこと
Reactで選択したアイテムを追加/削除できるようにしたい
上記の質問にて、親切な方にアイテムの選択にて、chosen: true
を利用するようなアドバイスを受けて、実装を進めていました。
今回困っているのは、この選択したアイテムを選択した順番に記号をつけたいと考えています。
ID: 2のアイテムを取ったあとに、ID: 1のアイテムを取った場合は、ID: 2が選択されたアイテムが1番目になって、更にそのID: 2が選択から外れた場合にはその次に指定されていたID: 1が繰り上がって1番目になるといった仕組みを作りたいと考えています。
発生している問題・エラーメッセージ
selectedIdのカウントで取得する方法が検討つきません。
該当のソースコード
◾️Select.js
親コンポーネント
import React, { Component } from 'react'; import ItemList from './common/ItemList'; class Select extends Component { constructor(props) { super(props); this.state = { items: [ { id: 1, name: 'React', chosen: false, }, { id: 2, name: 'Redux', chosen: false, } ] }; } _handleSelect = id => event => { const items = [...this.state.items]; const item = items.find(item => item.id === id); const count = items.filter(item => item.chosen).length; item.chosen = !item.chosen; this.setState({ item, selectedId: +=1 }); } render() { return ( <div className="App"> <h1>SelectItem</h1> <ItemList items={this.state.items} handleSelect={this._handleSelect} /> </div> ); } } export default Select;
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。