优化Get请求参数拼接

src/interface.ts

@@ -58,8 +58,19 @@ export abstract class TransformData<Q,T extends JSONResponse<Q>> {
 //发送请求
 export function request<Q,E extends JSONResponse<Q>,T extends TransformData<Q,E>>(api:string,method:Method,formParams: {[propName:string]: string | Blob|Array<string>},transform:T,callback:Function) {
     let formData
+    let queryParams=''
     if(method===Method.GET) {
-        formData=null
+        for(let formParam in formParams){
+            let params=formParams[formParam]
+            if(params instanceof Array) {
+                for(let value in params){
+                    queryParams+='&'+formParam+'='+params[value]
+                }
+            }else{
+                queryParams += '&' + formParam + '=' + params
+            }
+        }
+        queryParams='?'+queryParams.substr(1)
     }else{
         formData=new FormData()
         for (let formParam in formParams) {
@@ -77,7 +88,7 @@ export function request<Q,E extends JSONResponse<Q>,T extends TransformData<Q,E>
         }
 
     }
-    fetch(server+api,{
+    fetch(server+api+queryParams,{
         method:method,
         body:formData,
         credentials: 'include',

src/my/MyFriend.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import {Button, Col, Container, FormControl, Image, ListGroup, Row,} from "react-bootstrap";
-import {Chat, User} from "../entity";
+import {Chat, PageProps, User} from "../entity";
 import {Tooltip} from "@material-ui/core";
 import moment from "moment";
 import {MyInfo} from "./MyInfo";
@@ -38,6 +38,7 @@ export class MyFriend extends React.Component<
     //操作反馈
     result:JSX.Element|null;
     //
+    page?:PageProps;
 }
 >{
 
@@ -63,7 +64,7 @@ export class MyFriend extends React.Component<
     }
 
     componentDidMount() {
-        loadMyFriend('',this)
+        loadMyFriend('',this,1)
         this.joinChat()
     }
 
@@ -114,7 +115,7 @@ export class MyFriend extends React.Component<
         }else {
 
             let that = this
-            request(Api.account.findUser + "?name=" + name, Method.GET, {}, new UserTransform(), function (res: UserRes) {
+            request(Api.account.findUser, Method.GET, {name:name}, new UserTransform(), function (res: UserRes) {
                 switch (res.customResult) {
                     case PageDataMessage.ok:
                         that.setState({
@@ -141,14 +142,19 @@ export class MyFriend extends React.Component<
             <Container>
                 <Row className="d-flex justify-content-center bg-light">
                     <div>
-                        <ListGroup className="overflow-auto bg-light friend-list">
+                        <ListGroup className="overflow-auto bg-light friend-list" onScroll={(e:any)=> {
+                                if (e.target.scrollHeight - e.target.scrollTop === e.target.clientHeight) {
+                                    console.log('到达底部')
+                                }
+                             }
+                        }>
                             <ListGroup.Item variant="primary">我的好友</ListGroup.Item>
                             <ListGroup.Item>
                                 <FormControl placeholder="查找好友" onChange={(e)=>{
                                     this.setState({
                                         queryFriend:e.target.value
                                     })
-                                    loadMyFriend(e.target.value,this)
+                                    loadMyFriend(e.target.value,this,1)
                                 }}/>
                             </ListGroup.Item>
                             {this.state.friendList?this.state.friendList.map((friend:User,index:number)=>

src/my/MyHelp.tsx

@@ -129,7 +129,7 @@ export class MyHelp extends React.Component<{
 
     loadMyHelp(page:number){
         let that=this
-      request(Api.main.activity.myHelp+"?currentPage="+page,Method.GET,{},new HelpTransform(),function (res:HelpRes) {
+      request(Api.main.activity.myHelp,Method.GET,{currentPage:String(page)},new HelpTransform(),function (res:HelpRes) {
             switch (res.customResult) {
                 case PageDataMessage.ok:
                     that.setState({

src/my/MyLeaveWord.tsx

@@ -55,7 +55,7 @@ export class MyLeaveWord extends React.Component<
 
         let that=this
 
-        request(Api.account.leaveWord+"?currentPage="+page,Method.GET,{},new LeaveWordTransform(),function (res:LeaveWordRes) {
+        request(Api.account.leaveWord,Method.GET,{currentPage:String(page)},new LeaveWordTransform(),function (res:LeaveWordRes) {
             switch (res.customResult) {
                 case PageDataMessage.ok:
                     that.setState({

src/my/SeekHelp.tsx

@@ -77,7 +77,10 @@ export class SeekHelp extends React.Component<{ user:string },
     //打开志愿者列表
     openVolunteerList(activityId:number,status:ActivityStatus){
         let that=this
-        request(Api.main.activity.seekHelpUser+"?activityId="+activityId+"&activityStatus="+status,Method.GET,{},
+        request(Api.main.activity.seekHelpUser,Method.GET,{
+                activityId:String(activityId),
+                activityStatus:status
+            },
             new SeekHelpUserTransform(),function (res:SeekHelpUser) {
                 switch (res.customResult) {
                     case SimpleMessage.fail:

src/public.tsx

@@ -54,8 +54,11 @@ export function getStatus(status:ActivityStatus){
 
 
 //查找我的好友
-export function loadMyFriend(name:string,that:React.Component){
+export function loadMyFriend(name:string,that:React.Component,page:number){
-    request(Api.account.myFriend+"?currentPage=1&name="+name,Method.GET, {},new UserTransform(),function (res:UserRes) {
+    request(Api.account.myFriend,Method.GET, {
+        currentPage:String(page),
+        name:name
+    },new UserTransform(),function (res:UserRes) {
         switch (res.customResult) {
             case PageDataMessage.ok:
                 that.setState({

src/sub/IndexMenu.tsx

@@ -55,7 +55,10 @@ export class IndexMenu extends React.Component<{ cookies:Cookies },
     loadActivity(page:number){
         console.debug("检索活动关键字:"+this.state.title)
         let that=this
-        request(Api.main.activity.find+'?title='+this.state.title+"&currentPage="+page,Method.GET, {},new FindActivityTransform(),function (res:FindActivityRes) {
+        request(Api.main.activity.find,Method.GET, {
+            title:this.state.title,
+            currentPage:String(page)
+        },new FindActivityTransform(),function (res:FindActivityRes) {
 
 
             switch(res.customResult){

src/sub/SendHelp.tsx

@@ -167,7 +167,7 @@ export class SendHelp extends React.Component<{ onSendActivityOK:Function }, Sen
                         <InputGroup.Text>推荐好友</InputGroup.Text>
                     </InputGroup.Prepend>
                     <InputGroup.Prepend>
-                        <FormControl placeholder="请输入好友关键字" onChange={(e)=>loadMyFriend(e.target.value,this)}/>
+                        <FormControl placeholder="请输入好友关键字" onChange={(e)=>loadMyFriend(e.target.value,this,1)}/>
                     </InputGroup.Prepend>
                     <Form.Control as="select" custom ref={this.friendIndex}>
                         {this.state.friendList.map((friend:User,index:number)=><option key={"option"+index} value={index+""}>{friend.name}</option>)}

src/sub/Volunteer.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import {Button, Table} from "react-bootstrap";
 import {Input} from "../ui/InputGroup";
-import {PageProps, User} from "../entity";
+import {PageProps, User, UserType} from "../entity";
 import {Page} from "../ui/Page";
 import {Address} from "../ui/Address";
 import {Method, request} from "../interface"
@@ -46,8 +46,12 @@ export class Volunteer extends React.Component<{ undefined?:undefined },
     loadVolunteerList(page:number){
 
         let that=this
-        request(Api.account.find+'?info='+this.state.form.keyword+'&serviceAddress='+this.state.form.serviceAddress
+        request(Api.account.find,Method.GET,{
-            +'&currentPage='+page+'&userTypes=help',Method.GET,{},new FindUserTransform(),function(res:FindUserRes){
+            currentPage:String(page),
+            userTypes:[UserType.help],
+            info:this.state.form.keyword,
+            serviceAddress:this.state.form.serviceAddress?this.state.form.serviceAddress:""
+        },new FindUserTransform(),function(res:FindUserRes){
             switch (res.customResult) {
                 case PageDataMessage.ok:
                     that.setState({