Comment pouvez-vous définir une valeur prédéfinie sur un composant Form.Input ou Input dans l'interface utilisateur sémantique? J'ai essayé de passer defaultValue = "someVal" comme prop qui fonctionne. Mais cela ne met pas à jour la valeur si les accessoires changent. J'ai essayé de passer la valeur de prop = "someVal" qui le prénètre mais bloque tout accès pour éditer ce champ. Toutes les frappes sont ignorées. Il doit y avoir un moyen de fairePrépopulation du texte de saisie avec l'interface utilisateur sémantique réagissez
et de toujours le mettre à jour la valeur lorsque componentWillReceiveProps est déclenché?
est ici le composant d'entrée J'utilise
C'est la forme qui utilise l'entrée ci-dessous comme le contrôle https://react.semantic-ui.com/collections/form https://react.semantic-ui.com/elements/input
J'ai un AutoSaveInput.jsx qui rend essentiellement l'entrée ci-dessous avec un onChange pour enregistrer automatiquement chaque frappe (encore besoin d'ajouter un rebond).
<Label basic>{this.props.label}</Label>
<Form.Input
defaultValue={this.props.defaultValue}
disabled={this.props.disabled}
name={this.props.name}
onChange={this.onChange}
error={this.state.isDirty}
/>
L'entrée ci-dessus fonctionne initialement correctement. Cependant, lorsque de nouveaux accessoires arrivent, this.props.label se met à jour correctement, mais la valeur Form.Input n'est pas mise à jour du tout. Au lieu de cela, il montre toujours la valeur précédente.
De plus, si je change cela en ci-dessous, les valeurs se mettent à jour avec de nouveaux accessoires, mais vous ne pouvez pas saisir l'entrée elle-même. Le curseur saute juste à la fin de l'entrée et ne vous laisse pas taper autre chose.
<Label basic>{this.props.label}</Label>
<Form.Input
value={this.props.defaultValue}
disabled={this.props.disabled}
name={this.props.name}
onChange={this.onChange}
error={this.state.isDirty}
/>
De plus, les accessoires sont mis à jour par l'intermédiaire ReactRouter v4 en cliquant sur un clic où le var est ce que les charges de contenu différent de forme pour l'édition.
Pouvez-vous publier le composant dans lequel vous l'utilisez? Le contexte aiderait beaucoup. Cela semble assez facile, vous devriez en faire une entrée contrôlée avec la valeur définie sur une valeur prop et un onChange qui met à jour ce prop. –
Avoir une fonction onChange. Par exemple, 'onChange ((e) => this.state.data.input_name))' – fungusanthrax