Подскажите как вывести компонент в цикле?

Question

у меня есть state, который содержит массив объектов.

const state = store({
  arr: [{"name":"Mikle"},{"name":"Alex"}]
});

Хочу понять, как внутри компонента App вывести компонент столько раз - сколько элементов в массиве.

function App() {
  return(
    <div className="App">
       <Element />
    </div>
  );
}

Answer 1

например так, не совсем понятно что у вас за функция store в вопросе

const state = {
  arr: [{"name":"Mikle"},{"name":"Alex"}]
};

const Element = ({item})=>{
  return <div>{item.name}</div>
}

class App extends React.Component{
  constructor(){
    super();
    this.state = state;
  }

  render(){
    return <div>
      {this.state.arr.map(el=><Element item={el}/>)}
    </div>
  }
}

ReactDOM.render(<App/>,document.querySelector('#root'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>

БЛОГ НА HUSL

Подскажите как вывести компонент в цикле?

Ответы (1 шт):