Creating and managing Custom State values using Functions

Sebastian (00:01)
Hey, everyone, this is Sebastian from 8base. Today, what we're going to look at is how you can essentially set state values using functions. We're going to be looking at how you create custom state entries and then the way you can manage them in scripts and functions.

Sebastian (00:19)
Here I am in an app builder project. The first thing we do is here in the state pane, go and create a new custom state variable, state entry. This is going to be called a greeting. We're making it a string. I'm just going to set that value to hello.

Sebastian (00:40)
Now we have that as now global state variable. For example, if we wanted to, we could access the value. I'm just copy it from the clipboard there and then let's just go get some text, put that text here on the screen, give it a little bit of spacing. Then the properties, so it's a heading. Then the heading, expression, and the greeting value. We have that value there.

Sebastian (01:14)
Now we created one and we read it, but let's say that we wanted to actually have a function that changes that value. There's a lot different reasons we could do that. You could potentially be wanting to do some people look out where we translate it or whatever. But what we're going to do is write a quick function that essentially updates the global state variable.

Sebastian (01:37)
What you're able to do is since that is now in state and this function will have scope to it, we are going to look at greeting. Which has a set value function on it. In that, we can now set a different message. We are going to call this function greetInSpanish, and this is now going to be hola. We are going to save that function.

Sebastian (02:11)
Now, of course, we could be passing arguments into it or whatever we need to do. Let's make sure that we got that right. Greeting, set value. Let's say we wanted to run that function now. Let's just grab a button, drop our button here. We'll call it Translate. Then on the click event, we will run our function, which is greetInSpanish. Now if I preview my app, Translate, we have hola.

Sebastian (02:55)
I hope that this video helps you understand just some of the functions that you have available or the methods that you have available to managing state programmatically. If you have any questions, please ask them in the description. Looking forward to seeing you in future videos.

‍