Redux-Form: Selecting form values from array of objects - react-native

Question

I'm trying to select form values from array and show them below the input section. I know how to do it with individual fields but arrays are confusing me.
Here I am rendering array of fields:
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>
)
And here is my (unsuccessful) attempt to select individual values from array of fields:
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

Answer 1

your selector looks like a problem source.
do it something like this :
renderAddressFields = connect(state => {
let nameValue = selector(state, "nameofyourfieldarray[0].StreetName");
return {
nameValue
};
})(renderAddressFields)
then use it like:
export const renderAddressFields = ({ fields, meta: { touched, error }, nameValue })