Question

import React from 'react';

import 'materialize-css/sass/materialize.scss';
import 'materialize-css/js/materialize.js';
import 'font-awesome/scss/font-awesome.scss';
import '../styles/main.scss';

export default class AddStorageModal extends React.Component {
    constructor() {
        super();
        this.state = { storageName: "", sharingKey: "" };
    }
    handleChange(event) {
        this.setState({ [event.target.name]: event.target.value });
    }
    validate() {
        if (this.state.storageName === "" && this.state.sharingKey == "") {
            console.log("validation error");
            return false;
        }
        this.props.createNewStorage(this.state);
    }
    resetForm() {
        this.setState({ storageName: "", sharingKey: "" });
        $(function () {
            Materialize.updateTextFields();
        });
    }
    render() {
        if (this.props.storages.openAddStorageModal) {
            $('#add-new-storage-modal').openModal({ dismissible: false });
        }
        else {
            this.resetForm.bind(this);
            $('#add-new-storage-modal').closeModal();
        }
        return (
            <div id="add-new-storage-modal" className="modal" >
                <div className="modal-content">
                    <h6>Enter your new Storage (Freezer, Pantry, etc.) </h6>
                    <div className="row">
                        <form>
                            <div className="input-field col s12 m12 l12 ">
                                <input id="storage_name" type="text" value={this.state.storageName} name="storageName" onChange={ (event) => this.handleChange(event) } />
                                <label htmlFor="storage_name">Storage Name</label>
                            </div>
                            <br />
                            <h4 className="center">OR</h4>
                            <h6>Enter in the sharing key you were given.</h6>
                            <div className="input-field col s12 m12 l12 ">
                                <input id="sharing_key" type="text"  value={this.state.sharingKey} name="sharingKey" onChange={ (event) => this.handleChange(event) }  />
                                <label htmlFor="sharing_key">Sharking Key</label>
                            </div>
                        </form>
                    </div>
                </div>
                <div className="modal-footer">
                    <a href="#!" className="waves-effect waves-green btn-flat left" onClick={() => this.validate() }>Add</a>
                    <a href="#!" className="waves-effect waves-green btn-flat" onClick={() => this.props.loadAddStorageModal(false) }>Cancel</a>
                </div>
            </div>
        )
    }
}

当＆＃34; this.resetForm.bind（this）;＆＃34;被击中，它不执行它。它用来工作，但我不知道我做了什么，但现在它不起作用。

我将不得不向后工作并删除我所做的事情，看看我是否可以弄明白，但希望有人可能知道原因。

Answer 1

无论如何，那条线路都没有做任何事情。 Function.prototype.bind会返回一个新函数，但您没有对返回的函数执行任何操作。

你必须更清楚你期望该行做什么来获得比这更好的答案。也许你只是想调用resetForm：

this.resetForm( );

我在Javascript / ReactJs中打破了.Bind（）。不知道如何修复

1 个答案: