여러 번 요청하는 것을 방지하는 작은 작업

2666 단어 구문
목적: 봉인 요청을 통일적으로 처리할 때 매번 청구할 필요가 없다
1. 흔히 볼 수 있는 것은 떨림 방지 함수의 사용
2. 스타일 투명 덮개를 이용하여 다시 클릭할 수 없다. 예를 들어 axios: 요청하기 전에 차단하기 전에 바디 전체 화면 div를 삽입하고 요청이 끝나면 성공하든 실패하든 div를 제거한다(여기도 hide()나 show())
3. 오늘 Uniapp 애플릿을 할 때 Dom을 조작할 수 없고 요청을 할 때만 마스크가 필요한지 여부를 바꾸려고 합니다. vuex를 이용하여 변경된 마스크층을 숨기거나 표시해야 하는지, 페이지에서 값을 추출하고 요청을 통일적으로 봉인하는 곳에서store.commit('overlayshowchange',false)vuex의 값 바꾸기
import store from '../store/index.js'
const https = {
	request(options = {}) {
		const {
			url,
			method,
			data,
			loadhide
		} = options;
		let header = Object.assign({
			'token': wx.getStorageSync('token')
		}, {
			'openId': wx.getStorageSync('openId')
		}, {
			'content-type': 'application/json' //    
		})
		//     
		if (!loadhide) {
			wx.showLoading({
				title: '   ...'
			});
			store.commit('overlayshowchange',true)
		}
		return new Promise((resolve, reject) => {
			wx.request({
				url,
				method,
				data,
				header,
				success: function(res) {
					wx.hideLoading();
					store.commit('overlayshowchange',false)
					//     
					if (res.statusCode == 404) {
						reject();
						return false;
					} else if (res.statusCode != 200) {
						wx.showToast({
							title: '    ,    !' + url,
							icon: 'none'
						});
						return false;
					}
					//       
					resolve(res.data);
				},
				fail: function(error) {
					//   
					wx.hideLoading();
					store.commit('overlayshowchange',false)
					wx.showToast({
						title: '    ,    !',
						icon: 'none'
					});
					reject(error);
				},
				complete: function() {
					wx.hideLoading();
					store.commit('overlayshowchange',false)
				}
			});
		});
	}
};
export default https;

필요한 페이지
import {
		mapState,
		mapMutations
	} from 'vuex';
	computed: {
			...mapState(['overlayshow'])
		},

this를 통과하다.오버레이쇼에서 찾으실 수 있어요.
4. vuex 하면 어제 프로젝트를 할 때 상태 저장이기 때문에 페이지를 새로 고치면 없어요. 그래서 우리는local Storege와 결합하여 사용해야 해요. 아마도mutation 때일 거예요.
mutations: {
        SET_MENULIST: (state, menuList) => {
            LocalSorage.set('menuList', menuList);//    
            // localStorage.setItem('menuList', JSON.stringify(menuList));
            state.menuList = menuList;
        },

때를 얻다
const getters = {
    menuList: state => {
        if (!state.menu.menuList) {
            state.menu.menuList = LocalSorage.get('menuList');
        }
        return state.menu.menuList;
    },
    }

좋은 웹페이지 즐겨찾기