UI Builder - Page Parameters
in this video we're going to talk about page parameters and ui builder so we will start by creating a new page we're just going to call it home and i am going to create it from scratch without using a template so when i hit create it's going to prompt me for some advanced url settings here that's what we're going to do so there are two different types of parameters we can add a required parameter and an optional parameter which are you know what they say one is required one is optional but a required parameter is something that you'll you have to pass to the page in order for your page to work these are things they could be a sys id a table or a query and required parameters are useful for components because you can bind the value of that required parameter to part of the component so let's start with adding a required parameter here and i'm going to call this uh color uh that'll make sense in a minute so let's do that and then we will add an optional parameter as well and my optional parameter will be let's call it shape except spell it correctly and we'll save that all right so we have a color and a shape parameter i'm going to hit done and one of the things you'll notice is that my required parameter got its own spot in the url or page route up here and in order to preview this page i can't click this open button without supplying a parameter here so let's go ahead and we're going to hit blue and if i close out of that i can now open the page so of course nothing will happen because i don't have any content on this page uh but let's do one extra thing in this video uh in that we will we'll go ahead and take the value of that parameter and bind it to a component so let's add a quick component and i think i want stylized text here let's do that so we'll get rid of this and i'm going to click on this little dynamic data binding icon and i have access to a few different things here and one of the things that i have access to is this context.props and you'll notice that both of the parameters that i've added for color and shape are now available here so if i hit color uh we can see that color shows up here let's save it and open and we have blue let's change that all right and uh red blue we get both of them right so i've i've bound the url parameter to that component value there we can also take a look at that optional parameter so let's click on this test values box again and we have blue and let's say for shape we want to add square and so you'll notice that my required parameter has its own spot in the url so it's always going to be in this place in the url but my optional parameter is going to go after this params and then we have to know the optional parameter name which is shape and then the value is square so these are handled a little bit differently in the url but let's see if we can map those parameters the same way so let's add another stylized text and we'll do the same thing here and this time we'll set it to the shape that looks like it's going to work so let's save and then test this one so we can see that both of our parameter values showed up here blue and square and blue has its spot in the required parameter place in the url here and then the optional parameters show up after this params part of the url
https://www.youtube.com/watch?v=4UxdWqlAuqw