Reactjs 选择输入变量前面的框

我正在使用React和Material Ui，但TextField variant=“outlined”和ReactSelect存在问题，因为您可以在图像中看到，TextField的占位符甚至显示在select的框中

如您所见，问题只存在于variant=“contained”中

密集型：{
玛金托普：0
}
顾客
顾客
option.name}
getOptionValue={（option）=>option.id+''}
/>
发送

---

当我删除TextField variant=“outlined”时，输入的样式会发生变化，问题消失

您是否能够在中重新创建问题？

dense: {
    marginTop: 0
}
<React.Fragment >
      <Container component="main" maxWidth="xs" className={classes.container_create_order_form}>
      <CssBaseline />
      <Typography>Customer</Typography>
        <form className={classes.form} onSubmit={createOrder} validate>
        <div className={classes.wrapper}>
          <Grid container spacing={1}>
            <Grid item xs={12} sm={12}>
              Customer
            </Grid>
            <Grid item xs={12} sm={12}>
              <Divider/>
            </Grid>
             <Grid item xs={12} sm={4}>
              <ReactSelect
                value={inputs.stratum}
                name='stratum'
                onChange={onSelectChange}
                required
                options={inputs.stratums}
                getOptionLabel ={(option)=>option.name}
                getOptionValue ={(option)=>option.id + ''}
              />
            </Grid>
            <Grid item xs={12} sm={4}>
              <TextField
                className={classes.dense}
                onBlur={getClient}
                name="name"
                variant="outlined"
                margin="dense"
                required
                fullWidth
                id="name"
                value={inputs.name}
                label="First Nombre"
                autoFocus
              />
            </Grid>
            <Grid item xs={12} sm={4}>
              <TextField
                className={classes.dense}
                name="middleName"
                margin="dense"
                variant="outlined"
                fullWidth
                id="middleName"
                value={inputs.middleName}
                label="Middle Name"
                autoFocus
              />
            </Grid>
            <Grid item xs={12} sm={6}>
              <TextField
                className={classes.dense}
                onBlur={getClient}
                name="lastname"
                margin="dense"
                variant="outlined"
                required
                fullWidth
                id="lastname"
                value={inputs.lastname}
                label="Last Name"
                autoFocus
              />
            </Grid>
            <Grid item xs={12} sm={6}>
              <TextField
                className={classes.dense}
                name="secondSurname"
                margin="dense"
                variant="outlined"
                required
                fullWidth
                id="secondSurname"
                value={inputs.secondSurname}
                label="Second Surname"
                autoFocus
              />
             </Grid>
          </Grid>
        </div>
          <Button
            type="submit"
            fullWidth
            disabled={inputs.saving}
            variant="contained"
            color="primary"
            className={classes.submit}
          >
            Send
          </Button>
        </form>
        </Container>
    </React.Fragment>