Question

我有一个承诺，一旦用正确的动作调用正确的事件就返回。这就是我到目前为止所拥有的

 import {EventBus} from "./EventBus";



export function completed()  {
    EventBus.$on('queue-action', e => {
        return new Promise((resolve,reject) => {
            if(e.action == 'completed'){
                let item = e.queueItem
                resolve(item);
            }else{
                reject(new Error('No action specified in event object'))
            }

        })
    });
}



export function emitAction(action, queueItem)  {
    EventBus.$emit('queue-action', {
        action,
        queueItem
    });
}

在我的某个组件中调用已完成的函数时

completed()
            .then((item)=> console.log('promise'))
            .catch((error) => console.log(error) );

一旦我将then和catch方法添加到此函数，它就会返回undefined。看起来问题就在于我然后抓住了，但我无法确定它是什么。从我在网上看到的任何你用于then语句的数据的变量。

我要做的是让“队列”中的一个元素通过一个动作（例如已完成）向队列发出一个事件。然后，队列应该解析在该操作的预期目的中编辑队列的承诺，或者对承诺中的错误作出反应。

这是我到目前为止所做的事情

import {EventBus} from "./EventBus";
export class QueueEvent {
    constructor(){}
    emitAction(action, queueItem){
        return new Promise((resolve,reject) => {
            EventBus.$emit('queue-action', {
                action,
                queueItem
            },resolve,reject);
        });
    }
}
export class QueueEvents extends QueueEvent{
    constructor(){
        super();
    }

    listenForComplete() {
    }
}

Answer 1

你完成的函数没有返回一个promise（它按照你的注意返回undefined）。在调用queue-action时，您将返回事件发射器的promise。你在这里定义一个新函数：e => {并且返回一个promise的函数被传递给EventBus事件发射器

Answer 2

您希望将整个EventBus.$on()包装在您的承诺中，如下所示：

export function completed()  {
    return new Promise((resolve) => {
        EventBus.$on('queue-action', e => {
            if(e.action == 'completed'){
                let item = e.queueItem
                resolve(item);
            }
        });
    });
}

根据经验，除非你有一个非常具体的理由去做其他事情，否则返回一个承诺的函数应该将它的所有主体包裹在return new Promise(...);中。在承诺中包含大量代码也很正常。

注意代码：为了简洁，我删除了reject部分，因为我不确定这是你想要做的。除非在'completed'之前发生某些操作是错误的，否则你应该忽略这样的事件。

在vue中的JS Promise显示为未定义

2 个答案: