Как получить состояние из компонента

Question

У меня есть модальный диалоговый компонент, который принимает другой компонент в качестве содержимого и возвращает обещание для обработки результата (идея взята из здесь ).Как извлечь из содержимого состояние «время», чтобы добавить его в цепочку обещаний?

 import React from 'react'
    import Modal from './Modal'

    class Late extends React.Component {

        constructor(props) {

            super(props);

            this.state = {
                time: '18:48'
            };
          }

        render() {

          return (
            <div className='modal-body'>
                {this.time}
            </div>
          );
        }
      }

    export default function(message, options) {

        var form = <Late description={options.description} />;

        return Modal(form, message, options).then(() => ??);
    }

import React from 'react'
import ReactDOM from 'react-dom'
import '../css/modal.css'
import Promise from 'bluebird'
import _ from 'lodash'

Promise.config({ cancellation: true });

class Modal extends React.Component {

    constructor(props) {

        super(props);

        this.resolve = null;
      }

    abort = () => this.promise.cancel();
    confirm = () => this.resolve();

    componentDidMount() {

        this.promise = new Promise(resolve => this.resolve = resolve);

        return ReactDOM.findDOMNode(this.refs.confirm).focus();
    }

    backdrop = () => <div className='modal-backdrop in' />;

    modal() {

      var style = {display: 'block'};

      return (
        <div
          className='modal in'
          tabIndex='-1'
          role='dialog'
          aria-hidden='false'
          ref='modal'
          style={style}
        >
            <div className='modal-dialog'>
                <div className='modal-content'>
                    <div className='modal-header'>
                        <h4 className='modal-title'>
                            {this.props.message}
                        </h4>
                    </div>
                    {this.props.children}
                    <div className='modal-footer'>
                        <div className='text-right'>
                            <button type='button' className='btn btn-default' onClick={this.abort} >
                                {this.props.abortLabel}
                            </button>
                            {' '}
                            <button type='button' className='btn btn-primary' ref='confirm' onClick={this.confirm} >
                                {this.props.confirmLabel}
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>);
    }

    render() {
      return (
        <div>
          {this.backdrop()}
          {this.modal()}
        </div>
      );
    }
  }

  export default function(content, message, options) {

    var cleanup, component, props, wrapper;

    if (options == null) {

      options = {};
    }

    props = _.assign({

      message: message
    }, options);

    wrapper = document.body.appendChild(document.createElement('div'));

    component = ReactDOM.render(<Modal {...props}>{content}</Modal>, wrapper);

    cleanup = function() {

      ReactDOM.unmountComponentAtNode(wrapper);

      return setTimeout(function() {

        return wrapper.remove();
      });
    };

    return component.promise.finally(cleanup);
  };

Answer 1

если я вас правильно понял, вы хотите сделать какое-то действие после того, как модал сделан (нажмите OK, т.е.).Если это так, то вы можете обернуть модал компонентом и передать функцию в качестве реквизита модалу, чтобы, когда модальный компонент обрабатывал желаемое действие, он мог опустить функцию из реквизита. посмотрите, как передать функцию в качестве опоры , и Поднимите состояние