sanniassin
Value not passed to children on render
I'm working with a TextField from material ui and it renders differently with a value than it does without. Labels are hidden and it has a hint for the value instead. So, if there is a value when it's time to render it's important for that value to be set on the TextFields component.
My first thought was to just remove 'value' from the list of controlled props that are removed when creating the children. However, I'm thinking this may miss some important steps that would normally be called in onChange. So, before I do another PR for that I wanted to discuss the possible solutions and see what the maintainers think is the best.
For what it's worth I do have a workaround. By passing a function that renders my child component with the correct value, rather than passing just the component, I am able to force it to have the right value.
Example:
<InputMask value="some value">
{(props) => (
<TextField
value="some value"
{...props}
/>
)}
</InputMask>
If we can pass that value along on render it becomes this instead, which is much cleaner:
<InputMask value="some value">
{TextField}
</InputMask>
@raugturi Good point, thanks. It will take some time to investigate edge cases before I can make a decision though. Like a component that uses some other property name instead of value.
Too old topic. But scratching my head, how value is actually passed to TextField when not as prop? Is the cloneElement?
