'Change TextField border color if props is required in a react/material ui

If there is required then show TextField border color is red and once entered value then show NO RED border. Please click on the link to see images.

Entered Value

Without Value with Required field



Solution 1:[1]

You can put a condition on the TextFields error like this <TextField variant="outlined" label="Amount" name="amount' helperText={touched.amount ? errors.amount : ''} error={touched.amount && Boolean(errors.amount)} fullWidth />

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Gray Singh