从另一个函数推迟的退货已解决

I'm animating an automated conversation with a bot.

我正在使用机器人进行自动对话。

When the first message ("Hi there, take a look at this!") has been printed, I want to go to the next function .then(). However I don't know how to set up the r.resolve() in this case, it's like nested or something.

当打印出第一条消息(“你好,看看这个!”)时,我想转到下一个函数.then()。但是我不知道在这种情况下如何设置r.resolve(),它就像嵌套或者其他东西。

var messages = [
    "Hi there, take a look at this!",
    "Enter your address",
    "blah blah"
];

function printLetters(target, message, index, interval, n) {

    r = $.Deferred();
    $('#m'+n).fadeIn();

    if (index < message.length) {
        $(target).append(message[index++]);
        setTimeout(function () {
            printLetters(target, message, index, interval, n);
        }, interval);
    } else {
        r.resolve();
    }
    elem.scrollTop = elem.scrollHeight;

    return r;

}

function printMessage(n) {
    r = $.Deferred();
    setTimeout(function(){
        $('#m'+n+'>p').empty();
        r = printLetters('#m'+n+'>p', messages[n-1], 0, 40, n);
    }, 400);
    return r;
}

function startConversation() {
    printMessage(1)
        .then(showThumb1AndTapButton)
        .then(showThumb2AndScroll)
        .then(choosePaymentMethod)
        .then(enterAddress);
}

startConversation();

In this case, I want to get from printMessage(1) to the next .then() function, but I'm not sure how.

在这种情况下,我想从printMessage(1)到下一个.then()函数,但我不知道如何。

I'm not sure how to return the resolved r if the message has finished printing from the other function?

如果消息已完成从其他功能打印,我不确定如何返回已解析的r?

1 个解决方案

#1

Firstly, define your variables, use var in the needed scope for each variable.

首先,定义变量,在每个变量的所需范围内使用var。

The problem is how you're handling the r variable. You're creating the deferred and storing it on r, returning r and then, 400ms after the function ended, creating a new r (because the previous r haven't been defined with var, this one is other variable in the timeout's handler function) with the output of printLetters which is other deferred... that last r has nothing to do with the value returned by printMessage.

问题是你如何处理r变量。你正在创建延迟并将其存储在r上,返回r然后,在函数结束后400ms,创建一个新的r(因为之前的r没有用var定义,这个是超时处理函数中的其他变量)与printLetters的输出,其他延迟...最后一个与printMessage返回的值无关。

I would suggest you to define your r (or other name more descriptive) as global (outside any function), create the deferred object just once and then work always with this variable.

我建议你将r(或其他名称更具描述性)定义为全局(在任何函数之外),只创建一次延迟对象,然后始终使用此变量。

Update

Since you have several functions that need to return a deferred, you could just pass the deferred as an argument. The point is to be consistent with the variables. For example (not tested, take the suggestiong and try it yourself):

由于您有几个需要返回延迟的函数,因此您可以将延迟作为参数传递。关键是要与变量保持一致。例如(未经测试,请参考建议并亲自尝试):

function printMessage(n) {
    var r = $.Deferred();
    setTimeout(function(){
        $('#m'+n+'>p').empty();
        printLetters(r, '#m'+n+'>p', messages[n-1], 0, 40, n); <--var needed for this r to be defined inside here
    }, 400);
    return r;
}

And then

function printLetters(r, target, message, index, interval, n) {
    ...
    ...
    r.resolve(); <--Note this is the parameter r
}

No need to return anything or creating a second deferred, you're working with the same object created and returned by printMessage.

无需返回任何内容或创建第二个延迟,您正在使用printMessage创建并返回的同一对象。

#1