Как передать значения состояния из компонента в другой дочерний компонент, содержащий настройки параметров?

Question

У меня есть компонент basi c, который выходит и получает информацию о пользователе через ax ios, а затем устанавливает состояние пользователя. Но в компоненте у меня есть еще один вложенный компонент, который представляет собой компонент типа формы, который устанавливает заполнители, defaultValue, et c.

Это метод жизненного цикла, который получает данные и устанавливает состояние:

   componentDidMount() {
     axios.get('https://niftyURLforGettingData')
     .then(response => {
       console.log(response.data);
       const users = response.data;
       this.setState({ users });
     })
     .catch(error => {
       console.log(error);
     });
   }

В этот компонент вложен мой компонент формы:

<FormInputs
   ncols={["col-md-5", "col-md-3", "col-md-4"]}
   properties={[
    {
     defaultValue: "I NEED VALUE HERE: this.state.users.id",
    }           
/>       

если я использую только: {this.state.users.id} вне компонента, он работает ... но внутри формы .. .nothing.

Я совершенно уверен, что мне нужно передать состояние в этот компонент ... но не могу его понять.

Answer 1

Я почти уверен, что это не сработает, потому что users равно undefined, когда ваш компонент отрисовывается в первый раз. Попробуйте инициализировать эту переменную в состоянии, сделав что-то вроде этого:

state = {
 users: {}
}

, а затем используйте запасной вариант, поскольку id также будет undefined, делая это:

<FormInputs
   ncols={["col-md-5", "col-md-3", "col-md-4"]}
   properties={[
    {
     defaultValue: this.state.users.id || "Fallback Value", // this will render "Fallback value" if users.id is undefined
    }           
/>  

Если это не так, пожалуйста, поделитесь дополнительной информацией о вашей ситуации.