2017-06-04 23 views
2

我想从数组中选择表单值并在输入部分下面显示它们。我知道如何与个别领域做到这一点,但阵列让我感到困惑。田Redux形式:从对象数组中选择表单值

我在这里渲染阵列:

export const renderAddressFields = ({ fields, meta: { touched, error } }) => ( 
    <View> 
    {touched && error && <Text style={styles.ErrorMessage} >{error}</Text>}  
    {fields.map((ad, index) => 
     <View key={index}>   
     <Text>Address #{index + 1}</Text> 
     <View style={styles.AddressFields}> 
      <Field 
       name={`${ad}.StreetName`} 
       type="default" 
       component={renderField} 
       label="Street Name"/> 
      <Field 
       name={`${ad}.Number`} 
       type="numeric" 
       component={renderField} 
       label="Street Number"/> 
     </View>    
     </View>  
    )}  
    </View> 
) 

这里是我的(失败的)尝试选择字段数组单个值:

const { handleSubmit, mySubmit, fullAddress} = this.props 

... 

<Text>{fullAddress}</Text> 

... 

Form = reduxForm({ 
    form: 'registerForm',  // a unique identifier for this form 
    validate, 
})(withRouter(Form)) 

const selector = formValueSelector('registerForm') // <-- same as form name 
Form = connect(
    state => { 
    const { StreetName, Number } = selector(state, { Addresses: [{ StreetName: 'StreetName', Number: 'Number' }] }) 
    return { 
     fullAddress: `${StreetName || ''} ${ Number || ''}` 
    } 
    } 
)(Form) 

export default Form 

回答

0

你的选择看上去像一个问题的根源。 做这样的事情:

renderAddressFields = connect(state => { 

    let nameValue = selector(state, "nameofyourfieldarray[0].StreetName"); 

    return { 
     nameValue 
    }; 
})(renderAddressFields) 

然后用它喜欢:

export const renderAddressFields = ({ fields, meta: { touched, error }, nameValue })