2017-03-06 82 views
0

我想将数据从一个组件传递到另一个组件。但它没有亲子关系,并且彼此独立。我能够设置状态,但问题是在点击输入我的文本数据被清除后。不知道为什么,为什么TextBox提交后提交reactjs

export class EmpSearch extends React.Component { 
    // Not needed anymore as state going to Redux and not local component state 
/* 
    constructor(props) { 
    super(props); 
    this.state = { 
     Empnumber: '' 
    }; 
    } 
*/ 
EmpSearch = (e) => {  
if (e.key === 'Enter') { 
    browserHistory.push('/Emp/' + e.target.value); 
} 
} 

updateEmpNumber(e) { 

    this.props.dispatch({ 
      type: 'UPDATE_EMP_NUMBER', 
      payload: e.target.value 
     }); 
} 

render() { 
return (
    <div className="row"> 
    <form> 
     <div className="form-group"> 
     <label htmlFor="Empnumber">Emp Number</label> 
     <input type="text" className="form-control" id="Empnumber" placeholder="Emp Number" value={this.props.Empnumber} onChange={this.updateEmpNumber.bind(this)} onKeyPress={this.EmpSearch}/> 
     </div> 
    </form> 
    </div> 
); 
} 
} 
function mapStateToProps(state){ 
return { 
    Empnumber: state.Empnumber 
} 
} 

export default connect(mapStateToProps)(EmpSearch); 
+0

因此,当你点击'输入'你的数据被清除?或者当你尝试在输入框中输入内容时? –

+0

当我点击'输入'值清除.. – user2768132

回答

0

browserHistory.push('/Emp/' + e.target.value);可能导致您的组件被卸载和重新安装。 你说这个值存储在redux状态,但是我看不到你在哪里更新了redux状态。

+0

值存储在REDX和你我已经更新了上面的代码。所以如果browserhistory.push有问题,那么我应该用什么来代替这个? – user2768132

+0

好吧,我明白了。不知道这里发生了什么样的比赛情况。 使用''会不会更容易?回车键将触发表单提交事件。 – Tom