When adding another key, the addNewKey functions does this.$set( this.otherkeydata, key, ''); and at this point, the values shown in the string inputs .ext-wikilambda-zstring disappear.
This happens because the form is painted using the keys and values of the data object otherkeydata in the OtherKeys component. However, when the values of these fields are changed, the updated object is not the OtherKeys state, but that of the parent, contained in zobject. So whenever the state on which the form depends (otherkeydata) is changed, the DOM is generated again and the fields are reset to empty.
We should:
- First, figure out the need for keeping state local to the component as otherkeydata, there might be some reason behind it.
- Fix this behavior, whether is by keeping otherkeydata or by using the prop zobject to both capture values and print the forms. Ultimately, the user should not lose sight of the data that they have entered. in previous input fields.