I have a few dozen fields in my users' profiles, and I'm trying to build an efficient means of displaying them in the appropriate input form components.
eg, a profile might look like:
profile1={
name: 'Cornelius Talmadge',
phone: '1'
}
And if I could stack components in something like this...
export const FieldCatalogue = {
name: <TextField defaultValue={this.state.userProfile.name} label={"Name"} />
}
...then I could do something like this:
for (let field in Object.keys(profile1)) {
return FieldCatalogue[field]
}
which would be super cool.
This question has a great answer for if my input components were all constructed via the normal syntax (eg, Component = React.createClass({..})), but:
a. that's a lot of boilerplate
b. i'd have to pass props galore to each one, which isn't optimal
The perfect situation for me would basically be passing input components almost as strings, such that they fell into the scope (state, props, etc.) of whatever parent component they were rendered.
Is this possible and/or advisable?