layout: post

uniapp开发小技巧

subtitle: uniapp开发小技巧 date: 2020-10-29 author: BY header-img: img/post-bg-kuaidi.jpg catalog: true tags: - docker

uniapp开发小技巧

  • 全局的状态

/**
 * 全局的状态
 */
import Vuex from 'vuex'
import Vue from 'vue'
Vue.use(Vuex)
const store = new Vuex.Store({
    // 全局数据
    state: {
        // 登录凭证
        token: null,
        // 全局配置文件
        config_info: null,
        // 微信小程序
        minaapp_openid: null,
        // 用户数据
        member_info: null,
        // 剪切板数据
        clipboard: null,
        // 微信公众号是否需要绑定手机
        wechat_h5_need_bind: false,
        // 主题色
        userSkin: "default",
        // 受邀请码数据
        invitation_code: null
    },
    // 全局函数
    mutations: {
        /**
         * 设置token
         */
        setToken(state, token) {
            state.token = token;
            // 可持久化保存到Storage
            uni.setStorage({
                key: 'token',
                data: token,
                fail: function (e) {
                    console.log('---setToken fail', e);
                }
            });
        },
        /**
         * 获取token
         */
        getToken(state) {
            var _token = state.token;
            if (_token == "" || _token == null || _token == undefined) {
                _token = uni.getStorageSync('token');
            }
            return _token;
        },
        /**
         * 设置配置
         */
        setConfigInfo(state, config_info) {
            state.config_info = config_info;
            // 可持久化保存到Storage
            uni.setStorage({
                key: 'config_info',
                data: config_info,
                fail: function (e) {
                    console.log('---setConfigInfo fail', e);
                }
            });
        },
        /**
         * 获取配置
         */
        getConfigInfo(state) {
            var _config_info = state.config_info;
            if (_config_info == "" || _config_info == null || _config_info == undefined) {
                console.log('-----getStorageSync config_info');
                _config_info = uni.getStorageSync('config_info');
                console.log(_config_info);
            }
            return _config_info;
        },
    },
})

export default store
  • Loading 类实现

/**
 * Loading 类实现
 * 多个loading只有一个实例,因为loading多处调用 页面内,服务内
 */
class Loading {
    // 显示loading的列表
    static _isShowList = [];
    static timeout = 12000;
    static showLoading(key, msg = '加载中...') {
        this._isShowList.push({
            'key': key,
            'value': true,
            'msg': msg
        });

        uni.showLoading({
            mask: true,
            title: msg,
        });
        setInterval(() => {
            this._isShowList = [];
            uni.hideLoading();
        }, this.timeout);
    }
    static hideLoading(key) {
        console.log('------this.hideLoading _isShowList: ', this._isShowList);
        this._isShowList.forEach((element, index) => {
            if (element.key == key) {
                this._isShowList[index].value = false;
            }
        });
        var _false_num = 0;
        this._isShowList.forEach((element) => {
            if (element.value == false) {
                _false_num = _false_num + 1;
            }
        });
        if (_false_num == this._isShowList.length) {
            this._isShowList = [];
            uni.hideLoading();
        }
    }
}

export { Loading }