dashboard/src/charts/Wechat_session.js

import React, {Component} from 'react';
import {Row, Col, List, Avatar} from 'antd';
import {stores_Context} from '../config'
import {observer} from 'mobx-react';
import { toJS } from "mobx";

class Wechat_session extends Component {

    static contextType = stores_Context;
    constructor(props) {
        super(props);
        this.stores = this.props.stores;
    }
    render() {
        const {wechatStore} = this.stores;
        const userList = wechatStore.userList;

    return (
        <div>
            <Row>
                <Col span={8}>
                    <List
                        itemLayout="horizontal"
                        dataSource={userList}
                        renderItem={(user) => (
                            <List.Item>
                                <List.Item.Meta
                                    avatar={<Avatar src={user.avatar} />}
                                    title={user.username}
                                    description=""
                                />
                            </List.Item>
                        )}
                    />
                </Col>

            </Row>
        </div>
    );
    }

}
export default observer(Wechat_session);