Where to generate an array?

Question

React

for the dropdown list I create an array based on the data that comes from the api.
The countries array is created in the render method. Where can I generate this array once so that it is not constantly generated in the render?
stores - an array of objects from which we select the country fields and add them to the this.countries array. Then, using filter, we leave only unique values.

render() {
    const {data} = this.props;
    const stores = safeGet(data, 'retailers', EMPTY_ARRAY);
    stores.forEach(store => this.countries.push(store.country));
    const countries = this.countries.filter((country, index, array) => array.indexOf(country) === index);

    return (
      <main className={styles.root}>
        <FindStore items={stores} countriesList={this.countriesList}/>
      </main>
    );
  }

Answer 1

If using redux, you can use one of the options:
1. In mapStateToProps
2. On getting in saga if using redux-saga or async-action if using redux-thunk
3. In reducer
If not using redux, in componentDidMount or a method in which get data.

Answer 2

Try in componentDidMount