Callback with arguments

How-to Discussions
1

Hi,

I wonder why the Callback doesn’t accept arguments like:

<Rectangle>
    <Clicked>
        <Callback Handler="{click}">
            <Argument>arg1</Argument>
            <Argument>arg2</Argument>
        </Callback>
    </Clicked>
</Rectangle>

It is cheap to use callbacks with arguments, otherwise I export many functions with different arguments.

Or, is there another better solution? I know the callback function binding with a data context object, but this doesn’t help much.

Thanks!

2

Hi!

Thanks for reporting, you raise a good point. There is not a better solution than exposing the appropriate functions and obeservables. What usecase are you trying to solve here?

If we can find a proper usecase for this kind of logic we can add a feature request :slight_smile:

3

Just to hi-jack this thread. The reason I want something like this is to not have a lot of wrapper functions.

I don’t like this so much:

<Button><Callback Handler"{setTitleToText1}" /></Button>
<Button><Callback Handler"{setTitleToText2}" /></Button>
<Button><Callback Handler"{setTitleToText3}" /></Button>
<Button><Callback Handler"{setTitleToText4}" /></Button>
<Button><Callback Handler"{setTitleToText5}" /></Button>
<Button><Callback Handler"{setTitleToText6}" /></Button>
<Button><Callback Handler"{setTitleToText7}" /></Button>
4

I also would like to do something like this to centralize handlers or to use callbacks in enums.

5

Any updates? Can we now pass arguments?

6

A Button's (or Panel's more generally) Clicked function will receive an object whose data field contains the data context for the Button, if that’s what you guys are after:

JS:

function handler(arg) {
    // arg.data represents the item that was the data context for the button below
}

UX:

<Each Items="{items}">
    <Button Clicked="{handler}" />
</Each>
7

Hello!

I understand this example and use it in my app. But I am facing a problem I don’t understand.

arg.data contains my object, but when I try to use it it’s undefined: like this :

function addtobucket(arg) {

	dataStore.paniers.add(
		{
			name: "arg.data.name", // a test 
			id: arg.data._id, // undefined
			price: arg.data.price, // undefined
		}
	);
console.log("panier contient en JSON -->  " + JSON.stringify(arg.data)); // when I try this I can see all the data is here
8

Hi Gabson, can you provide a complete, minimal, runnable example for me, so I can more easily run this myself and help you out? Thanks!

9

Hello Jake,

Thansk for your answer, I am discussing this issue with Uldis on slack.
Great team by the way!

10

Cool, happy to hear it :smiley:

11

bumping this thread, was there an update on this? I have run into a similar issue and am interested to know.

12

@Kwame: there are no updates on whatever was discussed here in particular. You should make a new forum post, explaining exactly what it is that you want to do, and we’ll likely figure out a way for you to do it.

13
UserEvent will help you. (It accepts arguments)

 

https://www.fusetools.com/docs/fuse/userevent

 

Thanks to Fuse Devs for introducing this.