.addSubmitChangeListener не является функцией - PullRequest
0 голосов
/ 04 августа 2020

Я новичок в React Native и Flux, хочу спросить, у меня все еще возникают проблемы с использованием архитектуры потока для события эмиттера при нажатии кнопки. Поэтому я хочу, чтобы при нажатии кнопки загрузка для отправки данных прекращалась. Но я получаю ошибку .... Store.addSubmitMessageChangeListener не является функцией

Вот мой магазин. js

const SUBMIT_MESSAGE = 'SUBMIT_MESSAGE';

var MessageStore = assign({}, EventEmitter.prototype, {
   
    emitSubmitMessageChange: function(){
        this.emit(SUBMIT_MESSAGE);
    },
    addSubmitMessageChangeListener: function(callback){
        this.on(SUBMIT_MESSAGE,callback);
    },
    removeSubmitMessageChangeListener: function(callback){
        this.removeListener(SUBMIT_MESSAGE,callback);
    }
});

Dispatcher.register(function(action) {
    switch(action.actionType){
        case MessageConstants.PERFORM_SEND_MESSAGE:
            MessageStore.emitSubmitMessageChange();
            break;
        default:
            //noop
    }
})

А это мой views.jsx

import React from 'react';
import T from 'i18n-react';
import LaddaButton from 'react-ladda';

import ProfileStore from '../../stores/ProfileStore';
import ProfileActions from '../../actions/ProfileActions';
import MessageActions from '../../actions/MessageActions';
import MessageStore from '../../stores/MessageStore';
import Layout from '../layout.jsx';

import SystemStore from '../../stores/SystemStore';
import { SLIDE_RIGHT } from 'react-ladda/dist/constants';

export default class Message extends React.Component {
  constructor(props){
    super(props);
      this.state = {
        isLoggedIn: SystemStore.isLoggedIn(),
        profile: ProfileStore.getProfile(),
        fullName: SystemStore.systemUser().fullName,
        site: '',
        email: '',
        phone: '',
        home: '',
        subject: '',
        description: '',
        type: '',
        submitting: false
    };

    this.handleSubmitChange = this.handleSubmitChange.bind(this);
    this.clearForm = this.clearForm.bind(this);
    this.handleProfileChange = this.handleProfileChange.bind(this);
    this.handleSubjectChange = this.handleSubjectChange.bind(this);
    this.handleMessageChange = this.handleMessageChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  componentDidMount(){
    ProfileStore.addProfileChangeListener(this.handleProfileChange);
      if(!this.state.profile){
        ProfileActions.reload()
      }
    MessageStore.addSubmitMessageChangeListener(this.handleSubmitChange);
  }    

  componentWillUnmount(){
    ProfileStore.removeProfileChangeListener(this.handleProfileChange);
    MessageStore.removeSubmitMessageChangeListener(this.handleSubmitChange);
  }

  render(){
    return(
      <Layout>
        <div className='hs-dashboard row'>
          <div className='col-md-12'>
            <div className='col-xs-12 col-sm-6 col-md-5'>
              <div className='col-xs-12 hs-message-form'>
                <div className='row hs-message-form-head'>
                  <div className='hs-message-form-logo-container'>
                    <img className='col hs-message-form-logo' src='../../images/gii-logo-white.png'/>
                      <text className='hs-message-form-logo-label'>{T.translate('gii')}</text>
                  </div>
                  <div className='hs-message-form-label'>
                    { T.translate('message.title') }
                  </div>
                  <div className='hs-message-form-label-1'>
                    { T.translate('message.subtitle') }
                  </div>
                </div>
                                <div className='row hs-message-form-body'>
                                    <form className='hs-message-form-body-content'>
                                        <label>
                                             { T.translate('message.type') }
                                        </label>
                                        <select
                                            id="subject"
                                            value={ this.state.subject }
                                            onChange={ this.handleSubjectChange }
                                            className="form-control"
                                            required="true"
                                        >
                                            <option value="">{ T.translate('placeholder.selectSubject') }</option>
                                            <option value="PRAYER">{ T.translate('message.pray') }</option>
                                            <option value="ADDRESS">{ T.translate('message.address') }</option>
                                            <option value="VISIT">{ T.translate('message.visit') }</option>
                                        </select>
                                        <label>
                                            {T.translate('message.message')}
                                        </label>
                                        <textarea
                                            type="text"
                                            id="description"
                                            className="form-control"
                                            width=''
                                            placeholder={ T.translate('placeholder.message') }
                                            onChange={ this.handleMessageChange }
                                            value={ this.state.description }
                                            required
                                        />
                                        <LaddaButton
                                            loading={ this.state.submitting }
                                            onClick={ this.handleSubmit }
                                            data-spinner-size={ 30 }
                                            data-style={ SLIDE_RIGHT }>
                                            { T.translate('action.send') }
                                        </LaddaButton> 
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </Layout>
        )
    }

    clearForm(){
        this.setState({ subject: '', description: '' });
        alert(T.translate('message.mailSent'));
    }

    handleProfileChange(){
        this.setState({
            site: ProfileStore.getProfile().primarySite.name,
            email: ProfileStore.getProfile().emailAddresses[0].email,
            phone: ProfileStore.getProfile().contactNumbers[0].countryCode + ProfileStore.getProfile().contactNumbers[0].number,
            home: ProfileStore.getProfile().contactNumbers[1].countryCode + ProfileStore.getProfile().contactNumbers[1].number,
          });
          if(this.state.home === ''){
              this.setState({
                  home: '-'
              });
          }
    }
    
    handleSubjectChange(evt){
        this.setState({ subject: evt.target.value }, () => {
            if(this.state.subject === 'PRAYER') {
                this.setState({ type: 'REQUEST' });
            } else if(this.state.subject === 'ADDRESS') {
                this.setState({ type: 'INFORMATION' });
            } else if(this.state.subject === 'VISIT'){
                this.setState({ type: 'REQUEST' });
            }
        });
        
    }
    
    handleMessageChange(evt){
        this.setState({ description: evt.target.value });
    }

    handleSubmit(evt) {
        evt.preventDefault();
        
        if(this.state.subject === ''){
            alert('Error:' + T.translate('msg.categoryRequired'));
        } else if(this.state.description === ''){
            alert('Error:' + T.translate('msg.mailDescriptionRequired'));
        } else {
            alert(T.translate('msg.mailSending'));
        }

        this.handleProfileChange();
        this.handleSubjectChange(evt);
        this.handleMessageChange(evt);
        var messageInfo = {
            fullName: this.state.fullName,
            site: this.state.site,
            email: this.state.email,
            phone: this.state.phone,
            home: this.state.home,
            subject: this.state.subject,
            description: this.state.description,
            type: this.state.type
        };
        
        this.setState({ submitting: true }, () => {
            MessageActions.sendMessage(messageInfo, () => {
                this.handleSubmitChange();
            });
        });
    }

    handleSubmitChange(){
        this.clearForm();
        this.setState({
            submitting: false
        });
    }
}

Пожалуйста, помогите, я не знаю, где что-то не так в моем коде. Спасибо

...