之前旧项目维护，发现post提交form表单，还是会在搜索栏出现参数，并且参数是对象，百思不得其解。
 
 
​ 页面代码：
 
 
​仔细查看了之前同事的代码，发现form 表单action的url直接传了对象过去
 
 
 
​ ​​​​​去掉action链接后面的参数对象后ok！
 
 
 
 
 
 
 
 
​
 
 

 antd pro项目中遇到弹框嵌套表单的需求,并获取其中的数据,
 在官方提供的Form表单API中有一个触发表单验证的方法validateFields 触发表单验证
 类型: (nameList?: NamePath[]) => Promise
 
如下为项目中使用
 
const [form] = Form.useForm();

//此为Modal点击确定以后的回调
const okHandle = async () => {
    const fieldsValue = await form.validateFields();
    // const fieldsValue = await this.form.current.validateFields(); 如果是在 class component 下，需要通过 ref 获取数据域。
    //fieldsValue即为表单内的值
    console.log("okHandle -> fieldsValue", fieldsValue)
  };
 
如果是在 class component 下，需要通过 ref 获取数据域。
 
form = React.createRef();
//此为Modal点击确定以后的回调
const okHandle = async () => {
    const fieldsValue = await this.form.current.validateFields(); 
    //fieldsValue即为表单内的值
    console.log("okHandle -> fieldsValue", fieldsValue)
  };
 
 <Modal
      destroyOnClose
      title="创建表单"
      visible={modalVisible}
      onOk={okHandle}
      onCancel={() => onCancel()}
    >
      <Form
        form={form}
        {...layout}>
        <FormItem
          label="表单标题"
          name="subject"
          rules={[{ required: true }]}
        >
          <Input placeholder="请输入" />
        </FormItem>
        <Form.Item label="模版">
          <Select options={pickList} />
        </Form.Item>
        <FormItem
          label="流转步骤"
          name="desc"
        >
          <Input placeholder="请输入" disabled />
        </FormItem>
        <FormItem
          label="评定量表"
          name="desc"
        >
          <Input placeholder="请输入" disabled />
        </FormItem>
        <Form.Item label="人员选择">
          <TreeSelect
            treeData={treeData}
          />
        </Form.Item>
        <Form.Item name="startDate"
          rules={[{ required: true }]}
          label="开始日期">
          <DatePicker />
        </Form.Item>
        <Form.Item
          name="isScheduleSent"
          valuePropName="checked"
          label="定时发送">
          <Checkbox>开始日期后发送</Checkbox>
        </Form.Item>
        <Form.Item name="endDate" rules={[{ required: true }]} label="结束日期">
          <DatePicker />
        </Form.Item>
        <Form.Item name="dueDate" rules={[{ required: true }]} label="到期日期">
          <DatePicker />
        </Form.Item>

      </Form>
    </Modal>

1、在后台的时候，做多条件或单条件搜索的时候，一定要用get方法，因为涉及到分页问题
 
    具体实现：
 
     前端html的form表单页面：
 
           <div class="form-group">
          <form action="/dswiliu/admin.php" method="get"> //一定要用get方法，涉及到分页问题，如果post，点击下一页就不好使
             <div class="col-md-offset-6 col-sm-2">
                 <select class="form-control" name="handle">
                     <option value="">状态</option>
                     <option value="0"
                     <eq name="search.handle" value="0">selected="selected"</eq>
                     >未处理</option>
                     <option value="2"
                     <eq name="search.handle" value="2">selected="selected"</eq>
                     >已处理</option>
                     <option value="-1"
                     <eq name="search.handle" value="-1">selected="selected"</eq>
                     >已提交</option>
                     <option value="1"
                     <eq name="search.handle" value="1">selected="selected"</eq>
                     >已结款</option>
                 </select>
             </div>
             <div class="col-sm-3">
                 <input type="text" name="plateNo" class="form-control" placeholder="请输入车号"
                        value="{$search.plateNo}">//回调显示的数据
             </div>
             <input type="hidden" name="c" value="LogisticsOrder">
             <input type="hidden" name="a" value="index">
             <div class="col-sm-1">
                 <button id="button-search" type="submit" class="btn btn-sm btn-info col-sm-12">搜索</button>
             </div>
         </form>
     </div> 
 
 后台控制器中的写法：
 
     $data = array();//$data是查询的条件，组装成数组
 
         $search = array();//$search是查询的回调的数据
         if(isset($_REQUEST['handle']) && $_REQUEST['handle']!=""){
             $data['handle'] = intval($_REQUEST['handle']);//
             $search['handle'] = $data['handle'];
         if($data['handle'] == 0){
             $data['handleBusiness'] = $data['handle'];
         }
         if($data['handle'] == 2){
             $data['handle'] = 0;
             $data['handleBusiness'] = 1;
         }
         }
         if(isset($_REQUEST['plateNo']) && $_REQUEST['plateNo']!=""){
             $data['plateNo'] = array('LIKE','%'.$_REQUEST['plateNo'].'%');//模糊查询
             $search['plateNo'] = $_REQUEST['plateNo'];
         }
         $adminUser = session('adminUser');
         if(empty($data['handle'])  && $data['handle'] !=0 ){
             if($adminUser['admin_type'] == 1){
                 $data['handle'] = array('in','0,-1,1');//in操作，在某个范围里的
             }elseif ($adminUser['admin_type'] == 2){
                 $data['handle'] = array('NEQ',0);//不等于操作
             }
         }
         $this->assign('adminUser', $adminUser);
         $this->assign('search',$search);
 
2、对于前台的单搜索框，搜索多个字段的
 
    //or操作
 
        if ($_GET['title']) {
             // $title['release']= array('LIKE','%'.$_GET['title'].'%');
             $title['loadingAddr']= array('LIKE','%'.$_GET['title'].'%');
             $title['unloadingAddr']= array('LIKE','%'.$_GET['title'].'%');
             $title['goodsName']= array('LIKE','%'.$_GET['title'].'%');
             $title['_logic'] = 'or';
             $data['_complex'] = $title;
         }
 
 

 1
 、
 Thinkphp
 复合
 where
 的查询方法：or+and操作
 

 例如：
 

 $where['name']  = array('like','%thinkphp%');
 

 $where['title']  = array('like','%thinkphp%');
 

 $where['_logic'] = 'or';//用or连接
 

 $map['_complex'] = $where;//复合起来
 

 $map['id']  = array('gt',1);//查询的条件
 

 查询条件是
 

 ( id > 1) AND ( ( name like '%thinkphp%') OR ( title like '%thinkphp%'))
 

 

Q: 人员列表页面切换保留筛选项
 
ans:
 
/**
 * 表单组件在挂载时，将组件的 fields 值赋给对应的交互组件
 */
componentDidMount() {
    const { fields, pageIndex } = View;
    this.props.form.setFieldsValue(fields);
    this.getUser(pageIndex);
}

/**
 * 表单组件在卸载时，将对应的交互组件的值赋给组件的 fields
 */
componentWillUnmount() {
    View.fields = this.props.form.getFieldsValue();
    View.pageIndex = this.state.pageIndex;
}

 
可以保留所有筛选项以及当前pageIndex等。在组件卸载的时候，都是存储在View当前的实例上。在组件重新加载的时候，又设置当前form的值，以及传递当前pageIndex。
 
记录一下~