Calling a function with parameters

[tradingstratagem]

I try to pass a parameter for the function called when clicking the button, but I figured out that this doesn't work.
Is it there any workaround in order to pass parameters to the function and still have the spinner working?

<button class="btn btn-default" @click="test(param1)" v-promise-btn>Save</button>

Thank you

[STUkh]

Please, create gist with example. Everything should be fine with your case.

[tradingstratagem]

https://gist.github.com/tradingstratagem/fa6b6af7496867be1b9560e9bc4f487c

[STUkh]

@tradingstratagem your app logic a little bit incorrect. Click event should accept function that returns promise, instead of promise instance itself.

[tradingstratagem]

The example uses the same mechanism
https://github.com/STUkh/vue-promise-btn/blob/master/example/example.js

[STUkh]

@tradingstratagem in your case, function with params should looks like this:

function test (param1) {
    // return anonymous function that will be triggered on click from view with "param1" in closure
    return function () {
        return new Promise(function (res, rej) { setTimeout(function () { res() }, 2000) });
    }
}

[tradingstratagem]

I tried but nothing happens

[STUkh]

@tradingstratagem i've just tested on my own project - all works properly. Close this thread, fell free open new one with jsfiddle or jsbin example if you face this problem again.

[SebastienTainon]

Hello @STUkh @tradingstratagem

I can confirm the issue that was reported, and here is a reproducing jsfiddle: https://jsfiddle.net/rd5ef4t1/1/

I think there was a misunderstanding on the issue. Here the JSfiddle is based on the index.html/example.js files from the vue-promise-btn demo. The directive works well when the handler function doesn't need any argument. However when we pass any argument to the handler, the handler returns "undefined" instead of returning the promise, thus the directive isn't working.

It seems to me that the problem is very similar to this issue that you previously solved @STUkh vuejs/vue#7705 because when I look the generated code for my handlers, I get:

Without arguments, valid return:

on:{"click":function($event){$event.preventDefault();return dummyAsyncAction($event)}}}

With arguments, missing return:

on:{"click":function($event){$event.preventDefault();dummyAsyncAction('arg')}}}

It seems that the "return" is missing for handlers with arguments, what do you think?

[STUkh]

@SebastienTainon , @tradingstratagem - you can try v2.0.0 with extended mode - it fixes a lot of issues