本文介绍: uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -投票帖子排行实现
锋哥原创的uniapp微信小程序投票系统实战：
https://www.bilibili.com/video/BV1ea4y137xf/
后端：
/**
* 投票选型Controller控制器
* @author java1234_小锋 （公众号：java1234）
* @site www.java1234.vip
* @company 南通小锋网络科技有限公司
*/
@RestController
@RequestMapping("/voteItem")
public class VoteItemController {
@Autowired
private IVoteItemService voteItemService;
/**
* 获取指定投票的投票项排名
* @param voteId
* @return
*/
@GetMapping("/rank/{voteId}")
public R getRankByVoteId(@PathVariable(value = "voteId")Integer voteId){
List<VoteItem> voteItemList = voteItemService.list(new QueryWrapper<VoteItem>().eq("vote_id", voteId).orderByDesc("number"));
Map<String,Object> map=new HashMap<>();
map.put("voteItemList",voteItemList);
return R.ok(map);
}
}新建rank页面:
{
"path": "pages/rank/rank",
"style": {
"navigationBarTitleText": "票数排行"
}
}<template>
<view class="rank">
<view class="voteItem" v-for="item in voteItemList">
<view class="itemName">
{{item.name}}
</view>
<view class="number">
{{item.number}}票
</view>
</view>
</view>
</template>
<script>
import {getBaseUrl, requestUtil} from "../../utils/requestUtil.js"
export default{
data(){
return{
voteItemList:{}
}
},
onLoad(e) {
console.log(e.id)
this.getRankByVoteId(e.id)
},
methods:{
getRankByVoteId:async function(voteId){
const result=await requestUtil({url:"/voteItem/rank/"+voteId,method:"get"});
console.log(result)
this.voteItemList=result.voteItemList
}
}
}
</script>
<style lang="scss">
.rank{
padding: 15px;
background-color: white;
.voteItem{
display: flex;
justify-content: space-between;
border-radius: 10px;
background-color: #f4f5f7;
padding: 15px;
margin-bottom: 10px;
.itemName{
}
.number{
}
}
}
</style>原文地址:https://blog.csdn.net/caoli201314/article/details/135581133
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若转载，请注明出处：http://www.7code.cn/show_58540.html
如若内容造成侵权/违法违规/事实不符，请联系代码007邮箱：suwngjj01@126.com进行投诉反馈，一经查实，立即删除！
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
