uni-app 172标签列表和标签用户列表

app/router.js

  // 标签列表
  router.get('/tag/list',controller.tag.list);
  // 标签用户列表
  router.get('/tag/read/:id',controller.tag.read);

app/controller/group.js

'use strict';

const Controller = require('egg').Controller;

class TagController extends Controller {
    // 标签列表
    async list() {
        const { ctx, app } = this;
        let current_user_id = ctx.authUser.id;

        let rows = await app.model.Tag.findAll({
            where: {
                user_id: current_user_id
            },
            attributes: ['id', 'name']
        });

        ctx.apiSuccess(rows);
    }

    // 标签用户列表
    async read() {
        const { ctx, app } = this;
        let current_user_id = ctx.authUser.id;

        let id = parseInt(ctx.params.id);

        let rows = await app.model.Tag.findOne({
            where: {
                user_id: current_user_id,
                id
            },
            attributes: ['id', 'name'],
            include: [{
                model: app.model.Friend,
                attributes: ['nickname'],
                where: {
                    isblack: 0
                },
                include: [{
                    model: app.model.User,
                    as: "friendInfo",
                    attributes: ['id', 'nickname', 'avatar', 'username']
                }]
            }]
        });

        ctx.apiSuccess(rows.friends);

    }

}

module.exports = TagController;

/pages/mail/tag-read/tag-read.vue

<template>
	<view class="page">
		<!-- 导航栏 -->
		<free-nav-bar title="标签列表" showBack :showRight="false">
		</free-nav-bar>
		
		<free-list-item v-for="(item,index) in list" :key="index" :title="item.name" :cover="item.avatar || '/static/images/userpic.png'"  @click="handle(item)" :showRight="true" :showRightIcon="true">
		</free-list-item>
		
	</view>
</template>

<script>
	import freeNavBar from '@/components/free-ui/free-nav-bar.vue';
	import freeListItem from '@/components/free-ui/free-list-item.vue';
	import $H from '@/common/free-lib/request.js';
	import auth from '@/common/mixin/auth.js';
	import { mapState } from 'vuex';
	export default {
		mixins:[auth],
		components: {
			freeNavBar,
			freeListItem
		},
		computed:{
			
		},
		data() {
			return {
				id:0,
				list:[],
			}
		},
		// 监听下拉刷新
		onPullDownRefresh() {
			this.getData().then(res=>{
				uni.showToast({
						title:'刷新成功',
						icon:'none'
				});
				uni.stopPullDownRefresh();
			})
		},
		onLoad(e) {
			this.id = e.id;
			this.getData();
		},
		
		methods: {
			getData(){
				return new Promise((result,reject)=>{
					$H.get('/tag/read/'+this.id).then(res=>{
						this.list = res.map(item=>{
							return {
								id:item.friendInfo.id,
								name:item.nickname || item.friendInfo.nickname || item.friendInfo.username,
								avatar:item.friendInfo.avatar,
							}
						})
						result(res);
					})
				});
				
			},
			handle(item){
				uni.navigateTo({
					url:'../user-base/user-base?user_id='+item.id,
				})
			}
		}
	}
</script>

<style>

</style>

/pages/mail/tag-list/tag-list.vue

<template>
	<view class="page">
		<!-- 导航栏 -->
		<free-nav-bar title="标签列表" showBack :showRight="false">
		</free-nav-bar>
		
		<free-list-item v-for="(item,index) in list" :key="index" :title="item.name"  @click="handle(item)" :showRight="true" :showRightIcon="true">
		</free-list-item>
		
	</view>
</template>

<script>
	import freeNavBar from '@/components/free-ui/free-nav-bar.vue';
	import freeListItem from '@/components/free-ui/free-list-item.vue';
	import $H from '@/common/free-lib/request.js';
	import auth from '@/common/mixin/auth.js';
	import { mapState } from 'vuex';
	export default {
		mixins:[auth],
		components: {
			freeNavBar,
			freeListItem
		},
		computed:{
			
		},
		data() {
			return {
				form:{
					friend_id:0,
					nickname:"",
					lookme:1,
					lookhim:1
				},
				list:[],
			}
		},
		// 监听下拉刷新
		onPullDownRefresh() {
			this.getData().then(res=>{
				uni.showToast({
						title:'刷新成功',
						icon:'none'
				});
				uni.stopPullDownRefresh();
			})
		},
		onLoad(e) {
			this.getData();
		},
		
		methods: {
			getData(){
				return new Promise((result,reject)=>{
					$H.get('/tag/list').then(res=>{
						this.list = res
						result(res);
					})
				});
				
			},
			handle(item){
				uni.navigateTo({
					url:'../tag-read/tag-read?id='+item.id
				});
			}
		}
	}
</script>

<style>

</style>

感谢大家观看，我们下次见