如何通过在React应用中提交值来加载数据

Question

在我的react和spring-boot应用程序中，我有3个下拉菜单和一个Submit按钮。单击按钮后，它将从下拉列表中获取值，并将请求发送到控制器并获取DB值，最后显示在另一个页面上。

我尝试关注，但未成功。如何解决这个问题？

return (
      <form onSubmit={this.handleSubmit}>
      <div className="persent-one">
        <i className="fa fa fa-caret-down" aria-hidden="true"></i>
        <select className="textboxstyle" onChange={this.changeBrandLOV}><option value='-1'>Select Brand</option><option value ='0'>ALL</option>{optionItems}</select>
     </div>

     <div className="persent-one">
        <i className="fa fa-caret-down" aria-hidden="true"></i>
        <select className="textboxstyle" onChange={this.changeFamilyLOV}><option value='-1'>Select Family</option><option value ='0'>ALL</option>{familyOptionItems}</select>
     </div>
     <div className="persent-one">
        <i className="fa fa fa-caret-down" aria-hidden="true"></i>
        <select className="textboxstyle"><option key='-1'>Select Model</option><option key='0'>ALL</option>{modelOptionItems}</select>
     </div>
     <div className="persent-one less-btn">
        <input type="submit" name="submit" value="Search" className="btn btn-info cst-btn" id="srch"/>
     </div>
  </div>

功能

handleSubmit(event) {
        event.preventDefault();
        this.props.form.validateFields((err, values) => {
            if (!err) {
                const searchRequest = Object.assign({}, values);
                searchModes(searchRequest,0,50)
                .then(response => {
                    localStorage.setItem(ACCESS_TOKEN, response.accessToken);
                }).catch(error => {
                    if(error.status === 401) {
                        notification.error({
                            message: 'Polling App',
                            description: 'Your search selections are incorrect. Please try again!'
                        });
                    } else {
                        notification.error({
                            message: 'Polling App',
                            description: error.message || 'Sorry! Something went wrong. Please try again!'
                        });
                    }
                });
            }
        });
    }

功能

export function searchModes(searchRequest,page, size) {
  page = page || 0;
  size = size || POLL_LIST_SIZE;

  return request({
      url: API_BASE_URL + "/models?page=" + page + "&size=" + size,
      method: 'GET'
  });
}

在控制器类中

@RestController
@RequestMapping("/api/models")
public class ModelController {


    @GetMapping
    public PagedResponse<Model> getModels(@CurrentUser UserPrincipal currentUser,
                                                @RequestParam(value = "page", defaultValue = AppConstants.DEFAULT_PAGE_NUMBER) int page,
                                                @RequestParam(value = "size", defaultValue = AppConstants.DEFAULT_PAGE_SIZE) int size) {

        return modelService.getAllModels(currentUser, page, size);
    }

错误：