试图从引导转换为材质UI

Question

我有一个react应用，我正尝试将其从Bootstrap转换为Matrial-UI，但是当我尝试将模态从Bootstrap更改为Material-UI时，该表格不起作用。我以前没有使用过ui，所以我有点迷路了

这是我的引导程序

    <LocalForm className="container" onSubmit={(values)=>this.handleComment(values)}>


                              <Grid md={12}>
                                  <Label htmlFor="name">Your Name</Label>
                                  <Control.text model=".name" id="name" name="name" className="form-control" placeholder="Your Name"validators={{ minLength:minLength(3),maxLength:maxLength(15) }} />
                                  <Errors className="text-danger" model=".name" show="touched" messages={{
                                          minLength:'At least 3 characters',
                                          maxLength:'Must be 15 characters or less'
                                      }} />
                              </Grid> 
                              <Grid md={12}>
                                  <Label htmlFor="email">Your Email</Label>
                                  <Control.text model=".email" id="email" name="email" className="form-control" placeholder="Your Email"validators={{ minLength:minLength(3) }} />
                                  <Errors className="text-danger" model=".email" show="touched" messages={{
                                          minLength:'At least 3 characters'                                            
                                      }} />
                              </Grid>
                              <Grid className="form-group" md={12}>
                                  <Label htmlFor="body"> Comment</Label>
                                  <Control.textarea model=".body" id="body" name="body" rows="6" className="form-control"/>
                              </Grid>
                              <Grid md={12}>
                                  <Button type="submit" color="primary">Submit</Button>
                              </Grid>
                         </LocalForm>

这就是我在material-ui中所做的

                       <form  noValidate autoComplete="off">
                          <TextField id="standard-basic" name="name" validators={{ minLength:minLength(3),maxLength:maxLength(15) }} label="Your name" />
                          <TextField id="standard-basic" name="email" label="email" />
                          <TextField id="standard-basic" name="body" label="comment" />
                           <Button type="submit" color="primary">Submit</Button>
                        </form>

这是指向沙箱中完整应用程序的链接 codesandbox.io/s/compassionate-night-5cdej