Javascript ReactJs表单onSubmit句柄不工作

我有一个组件。提交表单时不调用handleSubmit。我使用meteorJs作为后端，使用ReactJs作为前端库。我不知道问题出在哪里。我试着注释掉除了输入标签以外的所有内容，但都不起作用

import React, {Component} from 'react';

export default class ConfessionPoster extends Component {

constructor(props) {
    super(props);
    this.state = {
        value: ''
    };

    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleInputChange = this.handleInputChange.bind(this);
}

//handle form submit
handleSubmit(event) {
    event.preventDefault();
    console.log("We are in handle");
    console.log(this.state.value);
}

handleInputChange(event) {
    event.preventDefault();

    // const target = event.target;
    // const confessionValue = target.value;
    // const confessionName = target.name;
    //
    // this.setState({[confessionName]: confessionValue});
    // console.log(this.state.confessionText);

    this.setState({value: event.target.value});
    console.log(this.state.value);
}

render() {
    return (

        <div id="confession-poster" className="modal">

            <div className="modal-content">

                <div className="row">
                    <div className="col s1">
                        <i className="material-icons prefix">account_circle</i>
                    </div>
                    <div className="col s11">
                        <h6>Kiran Kumar Chaudhary</h6>
                    </div>
                </div>

                <form onSubmit={this.handleSubmit}>

                    <div className="row confession-area">

                        <div className="input-field col s12">
                            <label htmlFor="confession-textarea">Your Confession</label>
                            <textarea id="confession-textarea" className="materialize-textarea" value={this.state.value} onChange={this.handleInputChange}/>
                        </div>

                    </div>

                    <div className="row">

                        <div className="col s12">
                            <i className="material-icons">photo_camera</i>&nbsp;
                            <i className="material-icons">link</i>&nbsp;
                            <i className="material-icons">location_on</i>
                        </div>

                    </div>

                    <div className="row">

                        <div className="input-field col s12">
                            <input type="checkbox" className="filled-in" id="hide-my-identity" defaultChecked/>
                            <label htmlFor="hide-my-identity">Hide my Identity</label>
                        </div>

                    </div>

                    <div className="row">
                        <input className="btn" type="submit" value="Post"/>
                    </div>

                </form>

            </div>

        </div>

    );
}
}

import React，{Component}来自'React'；
导出默认类ConfessionPoster扩展组件{
建造师（道具）{
超级（道具）；
此.state={
值：“”
};
this.handleSubmit=this.handleSubmit.bind（this）；
this.handleInputChange=this.handleInputChange.bind（this）；
}
//处理表格提交
handleSubmit（事件）{
event.preventDefault（）；
log（“我们在处理”）；
console.log（this.state.value）；
}
handleInputChange（事件）{
event.preventDefault（）；
//const target=event.target；
//const坦白价值=target.value；
//const commissionname=target.name；
//
//this.setState（{[CommissionName]：CommissionValue}）；
//console.log（this.state.commissiontext）；
this.setState（{value:event.target.value}）；
console.log（this.state.value）；
}
render（）{
返回(
会计圈
基兰·库马尔·乔杜里
你的供词
照相/摄像机
链接
地点
隐藏我的身份
);
}
}

我认为问题可能在其他地方重复，因为此代码正在工作，请检查fiddle：我也尝试过，但不起作用。@MayankShukla我使用materializecss作为css框架，此组件就是模型。我只使用ReactJs作为前端框架。现在如何调试此问题？控制台上有错误吗@基兰