vue-utility-stack v1.1.0

Vue-utility-stack

used to set a stack in component

Usage

step first

npm install --save vue-utility-stack

step second

import stack from 'vue-utility-stack'

vue.use(stack)

Methods introduction

pd_setStack(stackName:string)=>void

这个方法用来定义一个阻塞栈，用来收集请求同步的 waiter,它默认是处于阻塞状态的

你可以在任何访问到 this 的地方调用这个方法，并创建它

但是，如果你确定你需要它的话，我建议你越早创建它越好

this method used to define a stack as container to collect waiters, it always block

export default{
    data(){
        this.pd_setStack('YOUR_STACK_NAME')
        return {}
    },
    beforeCreated(){
        don't use it there!!!
    },
    created(){
        this.pd_setStack('YOUR_STACK_NAME')
    }
}

pd_setStackReady(stackName:string, readyNumber: number)=>void readyNumber default 0代表释放所有请求阻塞，你也可以传入一个数设置要释放的阻塞个数 这个方法用来取消一个阻塞栈并清空，即通知栈中的 waiter 请求同步的时间已到达，可以继续执行

通知的原则是先进先出，最先请求同步的 waiter，最先通知

这个方法通常在某个回调函数中使用

this method used to clean a waiters container, and cancel block for next waiters

it's usually in callback

export default {
  methods: {
    callBack() {
      this.pd_setStackReady('YOUR_STACK_NAME');
    },
  },
};

pd_getStackReady(stackName:string)=>Promise

这个方法用来创建请求一个栈的 waiter，如果栈阻塞，waiter 则等待，否则继续执行

this method used to request a stack whether block or ready. if block wait ready, ready continue.

export default{
	name:'willBeRequestedCpn',
	data(){
        this.pd_setStack('YOUR_STACK_NAME')
        return {}
    },
    methods:{
        callBack(){
            this.pd_setStackReady('YOUR_STACK_NAME')
        },
        ready(stackName){
        	return this.pd_getStackReady(stackName)
        }
    }
}

export default{
	name:'cpn1'
    methods:{
        async requestMethod(){
        	this.doSomething()//it will be done 'immediately',
        	// if this method is called
        	await willBeRequestedCpn.ready('YOUR_STACK_NAME')
            this.doSomething()//if the stack named 'YOUR_STACK_NAME'
            //is unready,it will be blocked;
            //else,it will be done 'immediately', but always after
            //willBeRequestedCpn done pd_setStackReady('YOUR_STACK_NAME')
        },
        doSomething(){
        	...
        }
    }
}

export default{
	name:'cpn2'
    methods:{
        async requestMethod(){
        	this.doSomething()//it will be done 'immediately',
        	// if this method is called
        	await willBeRequestedCpn.ready('YOUR_STACK_NAME')
            this.doSomething()//if the stack named 'YOUR_STACK_NAME'
            //is unready,it will be blocked;
            //else,it will be done 'immediately', but always after
            //willBeRequestedCpn done pd_setStackReady('YOUR_STACK_NAME')
        },
        doSomething(){
        	...
        }
    }
}

pd_setStackBlock(stackName:string)=>void

这个方法通常较少使用，它主要用来开启一个栈的阻塞（通过pd_setStack()方法创建的栈默认是阻塞的）

pd_hasStack(stackName:string)=>Booleabn

这个方法返回当前实例中是否有一个名为‘stackName’的阻塞栈