Всем привет! Столкнулся с такой задачей по курсу React. Нужно извлечь объект из массива и использовать пару ключ-значение. Ключ как уникальный key и значение как value для создания элемента. Хотел использовать _get из lodash, но не получается. Вопрос касается не react, а именно JS, поэтому задаю вопрос здесь.
class Component extends React.Component {
constructor(props) {
super(props);
this.state = {
value: 0,
logs: []
};
}
increment = () => {
const { value, logs } = this.state;
const currentNumber = value + 1;
const uniqKey = _.uniqueId();
this.setState({ value: currentNumber, logs: [{ [uniqKey]: currentNumber}, ...logs] });
};
decrement = () => {
const {value, logs } = this.state;
const currentNumber = value - 1;
const uniqKey = _.uniqueId();
this.setState({ value: currentNumber, logs: [{ [uniqKey]: currentNumber}, ...logs] });
};
removedItem = (uniqKey) => (e) => {
e.preventDefault();
const newLogs = this.state.logs.filter(log => log.uniqKey !== uniqKey);
this.setState({ logs: newLogs });
};
render() {
const { value, logs } = this.state;
return (
<div>
<div className="btn-group" role="group">
<button type="button" className="btn hexlet-inc" onClick={this.increment}>+</button>
<button type="button" className="btn hexlet-dec" onClick={this.decrement}>-</button>
</div>
{ logs.length > 0 &&
<div className="list-group">
{logs.map(_.get(log) => <button type="button" onClick={this.removedItem(uniqKey)} className="list-group-item list-group-item-action" key={uniqKey}>{log}</button>)}
</div>}
</div>
);
}
}
