一次清除所有表单字段，reactjs答案

【问题标题】：Clear all form fields at once, reactjs一次清除所有表单字段，reactjs
【发布时间】：2019-05-14 06:43:57
【问题描述】：

我想在单击表单中的重置按钮时清除所有字段。我怎样才能使用状态吗？我正在使用材质 ui 主题。我不想设置状态分别。那可能吗？

 <form className={classes.form}>
      <FormControl margin="normal" required fullWidth>
        <InputLabel htmlFor="Name">Name</InputLabel>
        <Input id="name" name="name" autoComplete="name" autoFocus />
      </FormControl>
      <div className ='switchdesign'>
       <FormControlLabel   required 
          label="Private ? "
          labelPlacement="start"
              control={
                <Switch
                  checked={this.state.checkedA}
                  onChange={this.handleChange('checkedA')}
                  value="checkedA" />
              } />
        </div>
      <div className ='switchdesign'>
          <FormControl className={classes.formControl}>
      <Select
        labelPlacement="start"
        value={this.state.age}
        onChange={this.onhandleChange}
        name="tenant"
        displayEmpty
        className={classes.selectEmpty}
      >
        <MenuItem value="" disabled>
          Choose Option
        </MenuItem>
        <MenuItem value="a">A</MenuItem>
        <MenuItem value="b">B</MenuItem>
        <MenuItem value="c">C</MenuItem>
      </Select>
      <FormHelperText>Tenant</FormHelperText>
    </FormControl>
      </div>

      <Button
        type="reset"
        fullWidth
        variant="contained"
        color="primary"
        className={classes.submit}
      >
        Reset
      </Button>

      <Button
        type="submit"
        fullWidth
        variant="contained"
        color="primary"
        className={classes.submit}
      >
        Submit
      </Button>
    </form>

我需要强制使用 refs 吗？这是更好的方法吗？或使用州更好？

【问题讨论】：

标签： javascript node.js reactjs ecmascript-6 single-page-application

【解决方案1】：

您可以通过将初始状态设置为变量然后像这样重置它来做到这一点

class MyComponent extends Component {
    static initialState = {
       // your object state
    }

    constructor(props) {
        super(props)

        //set your state here when init component
        this.state = {
        }
    }

    resetForm() {
        this.setState(initialState)
    }
}

如果还有问题请告诉我

【讨论】：