vue项目中使用generator函数

先来解释下什么叫generator函数*

语法上，可以把理解成，Generator 函数是一个状态机，封装了多个内部状态。

形式上，Generator 函数是一个普通函数。

整个Generator函数就是一个封装的异步任务，或者说是异步任务的容器，异步操作需要暂停的地方，都用yield语句。

Generator函数特征：

（1）function 关键字和函数之间有一个星号(*),且内部使用yield表达式，定义不同的内部状态。

（2）调用Generator函数后，该函数并不执行，返回的也不是函数运行结果，而是一个指向内部状态的指针对象。

最近看了这个generator函数所以有点想法，对比于我现在用的vue项目中经常要实现的执行一个方法，但是出于产品需求，必须要去处理别的事情再回来处理这个方法，说得有点笼统。就比如说（在vue环境中）我要实现一个方法
html中<h1 @click=“go”> test
js中：methods：{
go(){
console.log(1+1)
// 不知道要不要执行下面的步骤
console.log(1+2)
}

}
在实现go函数 console.log(1+1) 的时候想让用户确定是否要执行下一步，这时候要先弹个弹窗出来让用户决定是否要执行console.log(1+2)，如果在弹窗点取消那就不执行 点确定就执行，那么这个console.log(1+2)就要搬到另外的函数中去执行，当然，这里没有什么其他逻辑要处理所以搬到另外的函数去执行也是没区别的，这里我想阐述的只是这个模式，就是想执行完console.log(1+1)时弹个弹窗，在弹窗中的操作还可以在这个go函数中继续往下处理
那么就是用到这次的generator函数了
methods：{
* go(){
console.log(1+1)
yield ‘第一次调用’
// 不知道要不要执行下面的步骤
console.log(1+2)
yield ‘第二次调用’
}

}
弹窗中点确定的时候就执行go().next()就能执行console.log(1+2)了，如果点取消就不执行
是不是就很方便了啊，不用再开一个函数去处理完再回来这里处理了，话不多说，截点图理解更清晰点

这个是代码