¡Hola! Estoy buscando una forma de establecer un error cada vez que el valor insertado en el primer campo de texto sea diferente de "28.71", de lo contrario, configure correctamente
Mi código hasta ahora:
class Main extends React.PureComponent { render() { return ( <Box sx={SX.root}> <Box className="textFieldWrapper"> <TextField sx={SX.textField} id="filled-number" type="number" label={this.props.settings.texts.t1} variant="outlined" size="small" style={{width: '100px'}} /> </Box> <Box className="textFieldWrapper2"> <TextField sx={SX.textField2} id="filled-number" type="number" label={this.props.settings.texts.t2} variant="outlined" size="small" style={{width: '100px'}} /> </Box> </Box> ); } } // ----------------------------------------------------------------------------------------------------------------- // INTERNAL // ----------------------------------------------------------------------------------------------------------------- // ===================================================================================================================== // EXPORT // ===================================================================================================================== export default Main;Usando un estado de componente de reacción, uno puede almacenar el valor de TextField y usarlo como un indicador de un error. Material-UI expone los accesorios de error y helperText para mostrar un error de forma interactiva.
Echa un vistazo al siguiente ejemplo:
<TextField value={this.state.text} onChange={event => this.setState({ text: event.target.value })} error={text === ""} helperText={text === "" ? 'Empty field!' : ' '} />