【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,middlepageSize: 10,
pageIndex: 1
}
computed typeAndPageIndex => return type+pageIndex
watch typeAndPageIndex 变化的时候调用获取数据接口的方法
以上是 【element-ui】elementUI,点击分页与Tab标签都要向后台发送请求,如何渲染页面。 的全部内容, 来源链接: utcz.com/a/152286.html