JSON Server接口请求和接口参数拼接

r囧r小猫 2022-11-13 04:20 213阅读 0赞

1.  增

add(){ 
    	let params= { 
    	    "title": "阿西吧哈哈哈哈哈",
    	    "time": "2021-03-02 21:52",
    	    "id": "12"
    	}
        this.$axios
    		.post("http://localhost:3000/news/", params)
    		.then(res => { 
    		    console.log(res)
    		}).catch(()=>{ console.log('新增数据失败')})
     },

1.  删

del(){ 
        let delId = 6
        this.$axios
    		.delete("http://localhost:3000/news/"+ delId)
    		.then(res => { 
             	console.log(res)
    		}).catch(()=>{ console.log('删除数据失败')})
        },

1.  改

change(){ 
    	let Id = 6
        let newData={ 
          "title": "啦啦啦啦啦啦啦啦啦啦啦哈哈哈哈哈哈",
          "time": "2021/3/2 21:52",
        }
        this.$axios
    		.put("http://localhost:3000/news/"+ Id , { 
    			newData
    		})
    		.then(res => { 
            	console.log(res)
    		}).catch(()=>{ console.log('修改数据失败')})
        },

1.  查

sel(){ 
    	this.$axios
          	.get(this.newUrl('http://localhost:3000/news',{ "_limit":this.pageSize,"_page":this.pageNum}))
    		.then(res => { 
              console.log(res)
              // let arr = res.data
              // console.log(arr.find(item=>item.phone == '17864251034'))
    		}).catch(()=>{ console.log('查询数据失败')})
        },

查询数据中的拼接参数方法如下：

getParam(data){ 
    	let url = '';
    		for(var i in data){ 
    			let val = data[i] !==undefined ? data[i] : '';
    			url += `&${ i}=${ encodeURIComponent(val)}`
    		}
    		return url ? url.substring(1) : ''
    	},
    	//最终获取带参数的url方法
    	 newUrl(url, data){ 
    		return url += (url.indexOf('?') < 0 ? '?' : '') + this.getParam(data)//看原始url地址中开头是否带?，然后拼接处理好的参数
    	}

增删改查都可调用此方法拼接参数