onemorecupofcoffee
2019-12-03 17:33:29
Using the DefaultValue instead of Value should fix this.
This works with Fable.React and Fable.Elmish. Using DefaultValue will not initiate an update of the component / DOM in the react lifecyle and you should therefore not get the cursor changes.
From the link below: react uncontrolled components
In the React rendering lifecycle, the value attribute on form elements will override the value in the DOM. With an uncontrolled component, you often want React to specify the initial value, but leave subsequent updates uncontrolled. To handle this case, you can specify a defaultValue attribute instead of value.
Thx - I have been trying to follow the React guidance of using controlled components wherever possible, but this is a viable solution in this instance.
Using DefaultValue, if there are multiple input elements and one is deleted, say, in OnBlur, it loses track of which one is which. So this doesn't always work. Bizarrely, they'll show up in the right order in the inspector, but not rendered. In fact, clicking on the element in the inspector causes it to select the wrong one.
So I solved that problem using a key attribute.