Ответы пользователя по тегу React
  • Как очистить форму после выполнения?

    @fayster
    Сохраняйте изменение элементов формы в состоянии дочернего компонента, а потом просто отправляйте состояние и после очищайте его:
    function getDefaultState() {
    	return {
    		title: '',
    		year: '',
    		format: '',
    		actors: ''
    	};
    }
    
    export default React.createClass({
    	handleFilmAdd() {
        this.props.onFilmAdd({
    			id: 'some_id',
    			...this.state
    		});
    
    		this.setState(getDefaultState());
      },
    
    	handleChange(field, value) {
    		this.setState({
    			[field]: value
    		});
    	}
    
      render() {
        return (
        	<div>
           <input
            value={this.state.title}
    				onChange={this.handleChange.bind(this, 'title')}
            placeholder='Title'
            ref='addTitle'
          />
          	<input
            value={this.state.year}
    				onChange={this.handleChange.bind(this, 'year')}
            placeholder='Release Year'
            ref='addYear'
          />
            <input
            value={this.state.format}
    				onChange={this.handleChange.bind(this, 'format')}
            placeholder='Format'
            ref='addFormat'
          />
          <textarea
    	      value={this.state.actors}
    				onChange={this.handleChange.bind(this, 'actors')}
    	      placeholder='Actors'
    	      ref='addActors'>
          </textarea>
          <button onClick={this.handleFilmAdd}>Add</button>
          </div>
        );
      }
    });
    Ответ написан
    5 комментариев
  • Как сначала отправлять событие из view в store там с ним работать и затем тригерить?

    @fayster
    Когда число приходит в стор, то записываем сумму в переменную и делаем emit, в то время другая view получит уже новое значение, например:
    class Store extends EventEmitter {
        constructor() {
            super();
    
            this._dispatchToken = dispatcher.register(this._registerToActions.bind(this));
          
            this._id = 1;
        }
    
        _registerToActions(action) {
            switch(action.actionType) {
                case GENERATE_NEW_ID:
                    this._id += action.id;
                    this.emit(GENERATE_NEW_ID);
                    break;
                default:
                    break;
            }
            return true;
        }
    
        get id() {
            return this._id;
        }
    }
    
    class Listener extends React.Component {
        constructor() {
            super();
    
            this.go = this.go.bind(this);
    
            Store.on(GENERATE_NEW_ID, this.go);
    
            this.state = {
                id: Store.id
            };
        }
    
        go() {
            this.setState({
                id: Store.id
            })
        }
    }
    Ответ написан
    Комментировать