javascript - ReactJS assign values dynamic 2D array in componentWillMount

Question

I have some restaurants. Each of them have reviews. I want to store these reviews in a state. 2D array: each line represents a restaurant, and each element represents a review object.

It is necessary to do this operation in componentWillMount() due to the nature of the backend.

async componentWillMount() {
    let reviewsHelper = this.state.reviews.slice();
    for (var i = 0; i < restaurantCount; i = i + 1) {
        ...
            for (var j = 0; j < restaurant.reviewCount; j = j + 1) {
                ... get reviewObj
                reviewsHelper[i][j] = reviewObj
            }
    }
    this.setState({
        reviews: reviewsHelper
    })
}

...

constructor(props) {
    super(props)
    this.state = {
        reviews: [[], [], [], []],
        ...
    }
}

This works. However, as you might have seen, when I define the state in the constructor, I have 4 []. That means I support 4 restaurants.

How do I change this so I accept infinite restaurants? or, even better, a number of restaurantCount restaurants?

I am a total newbie in React, any help would be greatly appreciated.

question from:https://stackoverflow.com/questions/65873773/reactjs-assign-values-dynamic-2d-array-in-componentwillmount

Answer 1

I eventually fixed it after scouring Google for hours.

async componentWillMount() {
    let reviewsHelper = this.state.reviews.slice();
    for (var i = 0; i < restaurantCount; i = i + 1) {
        ...
        var helperList = []
        for (var j = 0; j < restaurant.reviewCount; j = j + 1) {
            ... get reviewObj
            helperList.push(reviewObj)
        }
        reviewsHelper.push(helperList)
    }
    this.setState({
        reviews: reviewsHelper
    })
}
constructor(props) {
    super(props)
    this.state = {
        reviews: [],
        ...
    }
}