@ozo/react-rock/src/stores/UserStore.js

React 移动端开发脚手架，基于CRA3，通用、开箱即用。

/**
 * 保存用户信息与登录信息token等其他公共信息
 */
import { observable, action, computed } from 'mobx';
// import { ApiUrls } from '@/api';
import { getQueryString } from '@/utils';
import Store from '@/stores/Store';
import { avatar } from '@/assets';

class UserStore extends Store {
    // 全局token
    @observable token = '';

    // 手机号 示例代码
    @observable mobile = '13888888888';

    // 昵称 示例代码
    @observable nickName = '某某某';

    // 头像 示例代码
    @observable imgUrl = avatar;

    constructor(rootStore) {
        super();

        this.rootStore = rootStore;
        // 数据持久化
        this.persistParam('token', true, true); // 单个key
        this.persistParam(['mobile', 'nickName', 'imgUrl']); // 多个key

        // 从Url获得token参数
        const tToken = getQueryString('token');
        if (tToken) {
            this.setToken(tToken);
        }

        Store.commonRequestData = { token: this.token };
        Store.refreshToken = this.refreshToken.bind(this);
    }

    /**
     * @description token 过期后自动刷新 token
     * @param {String} url 调用刷新的接口
     * @param {Object} params 调用刷新的接口的参数
     * @param {String} type 请求类型
     */
    refreshToken(url, params, type) {
        this.setToken(undefined);
        // 刷新token的逻辑
        //...
    }

    @action
    setToken(token) {
        this.token = token;
    }

    // 以下为示例代码
    @computed
    get userInfo() {
        return {
            mobile: this.mobile,
            nickName: this.nickName,
            img: this.imgUrl,
        };
    }

    @action
    setMobile(mobile) {
        this.mobile = mobile;
    }

    @action
    setNickName(name) {
        this.nickName = name;
    }

    @action
    setAvatar(imgUrl) {
        this.imgUrl = imgUrl;
    }
}

export default UserStore;