2016-09-03 3 views
0

я определяю форму в React с Bootstrap и Redux со следующим кодом:Реагировать значение + Bootstrap + Redux не работает в форме

import React from 'react'; 
import { FormGroup, ControlLabel, FormControl, HelpBlock, Button } from 'react-bootstrap'; 
import { connect } from 'react-redux'; 

import './actions'; 

const _c = component => connect(s => s)(component); 

const FieldGroup = ({ id, label, help, ...props }) => { 
    return (
    <FormGroup controlId={id}> 
     <ControlLabel>{label}</ControlLabel> 
     <FormControl {...props} /> 
     {help && <HelpBlock>{help}</HelpBlock>} 
    </FormGroup> 
); 
}; 

const LoginForm = _c(React.createClass({ 
    render() { 
    return (
     <form> 
     <FieldGroup 
      id="loginText" 
      type="text" 
      label="Text" 
      placeholder="Email" 
      value={this.props.user.email ? this.props.user.email[0] : ''} 
     /> 
     <FieldGroup 
      id="loginPassword" 
      label="Password" 
      type="password" 
     /> 
     <Button bsStyle="primary" bsSize="large">Login</Button> 
     </form> 
    ); 
    } 
})); 

Это работает, и значение отображается в поле «Имя пользователя» , но это не редактируется. Я попытался изменить value={this.props.user.email ? this.props.user.email[0] : ''} на defaultValue={this.props.user.email ? this.props.user.email[0] : ''}, и это делает его доступным для редактирования, но значение по умолчанию никогда не появляется. Что я делаю не так?

ответ

0

(я бы комментировать, но у меня нет 50 респ еще)

Похоже, ваше начальное значение может быть undefined. Можете ли вы console.log(this.props.user.email[0]) и посмотреть это значение?