Im utilizzando il Materiale dell'interfaccia utente passo-passo componente per eseguire il rendering di una lista di controllo come. Questa è una foto da loro documenti.
quando ho voluto introdurre uno stato di errore per la lista di controllo, ho scoperto che c'è un pilone chiamato errore per il StepLabel che posso dichiarare. Fondamentalmente vi permetterà di modificare gli stili come colore di sfondo, etc.
Tuttavia, quando ho impostato l'errore elica vero, c'è una nuova icona che è venuto su. Non voglio che questa icona, ma vogliono solo cambiare il colore di riempimento dal blu al rosso.
C'è qualche modo in cui posso rinunciare a quella icona e basta preoccuparsi per il colore di riempimento dei passo-passo, invece?
Ecco il mio codice:
<Stepper alternativeLabel activeStep={this.determineFormStep()} connector={<StepConnector />} className={classes.stepper}>
{formLabels.map((label, index) => {
return (
<Step key={label}>
<StepLabel
icon={label.step}
error={true}
StepIconProps={{
classes: {
root: classes.step,
completed: classes.completed,
active: classes.active,
error: classes.error,
disabled: classes.disabled
}
}}>
<span className={classes.sublabel}>
{label.sublabel3}
</span>
</div>
</StepLabel>
</Step>);
})}
</Stepper>