【element-ui】elementUI,点击分页与Tab标签都要向后台发送请求,如何渲染页面。

图片描述

项目使用Vue.js加elemetUI Pagination分页加Tab标签要求
点击不同的(全部评价,好评,中评,差评)分别从后台取数据并显示。
点击底部分页也需要从后台取数并显示到页面, 请问大神如何实现?请问大神如何实现?
我的思路是当点击不同tab标签,向后台发送请求。
给每个tab标签绑定一个changData点击事件并且传递实参

<el-tab-pane label="好评" name="second" @tab-click="handleClick" @click='changData(good)' ></el-tab-pane>

changeData:function(){

var baseUrl = 'http:*******//api/v1/optometrist-free/clients/comment';

let data = {

'good': this.good,

'bad': this.bad,

'middle':this.middle,

}

this.refs.content.innerHTML = "";

axios.get(baseUrl,{params:data}).then((res)=>{

return Promise.resolve(res.data)

}).catch((err)=>{

console.log("网络繁忙")

})

}

回答:

这api设计的不太合理,全部评价,好评,中评,差评可以用一个参数
而且也没分页的入参
建议先改下接口,传参格式可以是:
{

type:'all',// all,good,bad,middle

pageSize: 10,

pageIndex: 1

}
computed typeAndPageIndex => return type+pageIndex
watch typeAndPageIndex 变化的时候调用获取数据接口的方法

以上是 【element-ui】elementUI,点击分页与Tab标签都要向后台发送请求,如何渲染页面。 的全部内容, 来源链接: utcz.com/a/152286.html

回到顶部