vide/docs/tut/crash-course/12-actions.md
alicesaidhi f8e84f9f8d
Improve Documentation Site (#41)
* update css and snippets

* Add banner

* improve home page

* Update Banner

* cleanup

* Update font to JetBrains Mono

* Add a quick look to Home

* Simplify Home Page

* Removed banner, removed copyright notice, reduced home page
2024-11-03 17:32:19 +00:00

1.2 KiB

Actions

Actions in Vide are special callbacks that you can pass along with properties, to run some code on an instance receiving them.

local action = vide.action
create "TextLabel" {
    Text = "test",

    action(function(instance)
        print(instance.Text)
    end)
}

-- will print "test"

Actions can be wrapped with functions for reuse. Below is an example of an action used to listen for property changes:

local action = vide.action
local effect = vide.effect
local cleanup = vide.cleanup

local function changed(prop: string, callback: (new) -> ())
    return action(function(instance)
        local connection = instance:GetPropertyChangedSignal(prop):Connect(function()
            callback(instance[property])
        end)

        -- remember to clean up the connection when the reactive scope the action
        -- is ran in is destroyed, so the instance can be garbage collected
        cleanup(connection)
    end)
end

local output = source ""

local instance = create "TextBox" {
    changed("Text", output)
}

effect(function()
    print(output())
end)

instance.Text = "foo" -- "foo" will be printed from the effect

The source output will be updated with the new property value any time it is changed externally.