원시 원시 코드 양식이 표시되지 않습니다.

이것은 redux 양식의 코드입니다. 또한 enableReinitialize을 true으로 설정하고 반응 형식 문서를 따랐습니다.원시 원시 코드 양식이 표시되지 않습니다.

테스트 목적으로 initialValues 개체를 하드 코딩했습니다. 하지만 여전히 양식이 초기화되지 않습니다.

import React, { Component } from 'react'; 
import { Container, Header, Body, Content, Title, Button, Text, Left, Icon, Right } from 'native-base'; 
import { Field, reduxForm } from 'redux-form'; 
import { connect } from 'react-redux'; 
import MyTextInput from './TextInput'; 
import { fetchProfileData } from '../../actions'; 

const validate = values => { 
    const error = {}; 
    error.email = ''; 
    error.name = ''; 
    error.mobile = ''; 
    let ema = values.email; 
    let nm = values.name; 
    let mob = values.mobile; 
    if (values.email === undefined) { 
    ema = ''; 
    } 

    if (values.name === undefined) { 
    nm = ''; 
    } 

    if (values.mobile === undefined) { 
    mob = ''; 
    } 

    if (ema.length < 8 && ema !== '') { 
    error.email = 'too short'; 
    } 

    if (!ema.includes('@') && ema !== '') { 
    error.email = '@ not included'; 
    } 

    if (nm.length > 8) { 
    error.name = 'max 8 characters'; 
    } 

    if (mob.length < 10 && mob !== '') { 
    error.mobile = 'min 10 digits'; 
    } 
    return error; 
}; 

class SimpleForm extends Component { 

    componentWillMount() { 
    this.props.fetchProfileData(); 
    } 

    render() { 
    const { handleSubmit } = this.props; 
    console.log(this.props.initialValues); 
    return (
     <Container> 
     <Header> 
      <Left> 
      <Button 
       transparent 
       onPress={() => this.props.navigation.navigate('DrawerOpen')} 
      > 
      <Icon name="menu" /> 
      </Button> 
      </Left> 
      <Body> 
      <Title>Profile</Title> 
      </Body> 
      <Right /> 
     </Header> 
     <Content padder> 
      <Field name='name' component={MyTextInput} label='Vendor Name' /> 
      <Field name='company_name' component={MyTextInput} label='Company Name' /> 
      <Field name='office_address' component={MyTextInput} label='Office Address' /> 
      <Field name='email' component={MyTextInput} label='Email' /> 
      <Field name='mobile' component={MyTextInput} label='Contact' /> 
      <Button block primary onPress={handleSubmit((values) => console.log(values))} style={{ marginTop: 20 }}> 
      <Text>Save</Text> 
      </Button> 
     </Content> 
     </Container> 
    ); 
    } 
} 

const mapStateToProps = state => { 
    return { 
    initialValues: { name: '[email protected]' } 
    }; 
}; 

SimpleForm = connect(mapStateToProps, { fetchProfileData } 
)(SimpleForm); 

export default reduxForm({ 
    form: 'test', 
    validate, 
    enableReinitialize: true 
})(SimpleForm);

출처

2017-10-29 user3412321

나는 얼마 동안이 문제에 시달렸습니다. 나는 소품을 가지고 무엇인가를 얻을 수 없었습니다. 그러나 나는 초기 상태의 것들을 필요로하기 때문에 이것은 나를 위해 일한다. 희망은 당신을 위해 또한 작동합니다.

----- 초기 값만 한 번만 설정하려는 경우에 적합합니다.

export default reduxForm({ 
    form: 'test', 
    validate, 
    initialValues: { name: '[email protected]' } 
})(SimpleForm);

편집 :. 그것은 내가에 변수를 전달하기 위해 필요한 듯이 mapStateToProps에 설정된 변수 나를 위해 작동 할 수 있었다. 나는 당신의 설정이 상태와 소품을 폼에 매핑하고, 그 다음에 reduxForm을 추가하기 때문에 작동하지 않았다고 생각한다. 그것은 다른 방향 일 필요가있는 것처럼 보입니다.

const mapStateToProps = (state) => { 
    return { 
    initialValues: { 
     name: 'foobar', 
    } 
    } 
} 

export default (connect(mapStateToProps, mapDispatchToProps)(reduxForm({ 
    form: 'groupForm', 
    enableReinitialize: true 
})(SimpleForm)))

출처

2017-10-29 23:38:41

고맙습니다. – user3412321

그것이 당신을 위해 일했다면,이 문제를 해결하고자하는 미래의 개발자들을 돕기위한 답으로 광산을 표시하십시오. –

원시 원시 코드 양식이 표시되지 않습니다.

답변

관련 문제