Как обновить состояние с помощью Relay QueryRenderer props

Question

У меня есть компонент реагирования с формой для обновления записей базы данных. Вот в чем дело: данные загружаются с помощью компонента React-Relay QueryRenderer следующим образом:

class Update extends Component {
   //constructor..
   //some stuff
   render() {
    return(
      <QueryRenderer
        environment={environment}
        query={UpdateQuery}
        render={({error, props}) => {
        //validations
          return (
            <Form loading={this.state.loading}>
            //inputs
            </Form>
           )...
      }/>
    )}

Предполагается, что переменная props хранит результат ответа сервера в случае успеха. Однако мне нужно вызвать обновление со значениями this.state. Мне нужен способ setState со значениями реквизита.

Я пытался с componentDidMount и с помощью refs и строковых ссылок и обратного вызова, чтобы получить defaultValue из Inputs. Я получил неопределенные значения при вызове this.refs

На данный момент, это работает, если я вызываю функцию в функции рендеринга QueryRenderer, которая устанавливает состояние с помощью реквизита, если состояние пусто. Например

function initValues(props){
  if(!this.state.name)
    this.setState({name: props.result.name})
}

Но это приводит к созданию анти-паттерна (чистого метода рендеринга), который мне нужно решить.

Изменить: Для тех, кто интересуется, как я решил это. Благодаря ответу Чарли мне удалось создать оболочку компонента UpdateForm, которая получает реквизиты от QueryRenderer, и для обновления состояния компонента моего родителя я передала функцию handleChange в качестве реквизита моему компоненту FormUpdate

Answer 1

Используйте componentWillReceiveProps в вашем компоненте формы

class Form extends React.Component {

    ...

    componentWillReceiveProps(nextProps) {
        if (nextProps.loading) return
        this.setState({
           name: nextProps.name
        })
    }

    ...
}

Это установит состояние только один раз, как только станут доступны данные, поскольку QueryRenderer вызывает визуализацию только один раз после загрузки данных.