redux-form kullanmayı deniyor isSubmitting seçicisi

Question

Aşağıdaki redux-form bileşenine sahibim ve bir gönderme düğmesini devre dışı bırakmak için isSubmitting seçiciyi kullanmak istiyorum. Form

göndererek edildiğinde Ancak, hiçbir zaman gerçek döndüren Benim mapStateToProps fonksiyonu: my render() fonksiyonun

const mapStateToProps = (state, props) => { 
    const firstTemplate = _.first(props.templates.toList().toJS()); 
    const course = props.courses.getIn([0, 'id']); 
    let values = { submitting: isSubmitting('CreateNewAssignmentForm')(state) }; 
    if (firstTemplate === undefined) { 
    return values; 
    } 

    if (firstTemplate) { 
    values = { 
     course, 
     template: firstTemplate, 
     submitting: isSubmitting('CreateNewAssignmentForm')(state), 
     initialValues: { 
     template: firstTemplate.id, 
     wordCount: firstTemplate.essay_wordcount, 
     timezone: momentTimezone.tz.guess(), 
     label: 'TRANSPARENT', 
     }, 
    }; 
    } 

    return values; 
}; 

export default connect(mapStateToProps)(
    reduxForm({ 
    form: 'CreateNewAssignmentForm', 
    destroyOnUnmount: false, 
    shouldAsyncValidate, 
    shouldValidate, 
    })(CreateNewAssignmentForm), 
); 

kısmi pasajı:

render() { 
    const { handleSubmit, templates, courses, submitting } = this.props; 

    return (
     <StandardModalComponent 
     id="AssignmentModal" 
     title="Create Essay Draft" 
     primaryAction={['Submit', handleSubmit, { disabled: submitting }]} 
     width={800} 
     > 

i doğru seçici kullanıyorum?

Answer 1

reduxForm hoc ile isSubmitting seçicisini kesinlikle kullanmanıza gerek yoktur. reduxForm hoc, formun gönderilip gönderilmediğini kontrol etmek için kullanılabilecek bir submitting pervanesinden geçecektir. Fakat redux formun ne zaman teslim edildiğini bilmesi gerekiyor. onSubmit, bir Promise dışında bir değer döndürürse, submitting prop, her zaman false olacaktır, redux-form gönderenin bittiğini anlamasının bir yolu yoktur, ancak onSubmit bir söz verdiyse (@Sreeragh AR önerisi gibi) Söz verilinceye veya reddedilene kadar submitting desteğini true değerine ayarlayacaktır.

Dikkat edilmesi gereken başka bir şey var: mapStateToProps ürününüzün içinde isSubmitting seçiciyi kullanıyorsunuz, bu gerçekten çok kötü. Bu, her rerender için bir seçici oluşturacaktır. Bunu yapmanın doğru yolu, createMapStateToProps işlevini kullanmaktır.

const createMapStateToProps =()=> { 
    const isSubmittingSelector = isSubmitting('CreateNewAssignmentForm'); 

    return (state, props) => { 
    const firstTemplate = _.first(props.templates.toList().toJS()); 
    const course = props.courses.getIn([0, 'id']); 
    let values = { submitting: isSubmittingSelector(state) }; 
    if (firstTemplate === undefined) { 
     return values; 
    } 

    if (firstTemplate) { 
     values = { 
     course, 
     template: firstTemplate, 
     submitting: isSubmittingSelector(state), 
     initialValues: { 
      template: firstTemplate.id, 
      wordCount: firstTemplate.essay_wordcount, 
      timezone: momentTimezone.tz.guess(), 
      label: 'TRANSPARENT', 
     }, 
     }; 
    } 

    return values; 
    } 
} 

export default connect(createMapStateToProps())(
    reduxForm({ 
    form: 'CreateNewAssignmentForm', 
    destroyOnUnmount: false, 
    shouldAsyncValidate, 
    shouldValidate, 
    })(CreateNewAssignmentForm), 
);