> For the complete documentation index, see [llms.txt](https://docs.emobiq.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.emobiq.com/emobiq-client/006-actions-and-visual-logic/action-reference/react-native/component/setproperty.md).

# setProperty

## Description

Allows users to set a property of a component.

## Input / Parameter

| Name        | Description                                            | Input Type  | Default | Options | Required                       |
| ----------- | ------------------------------------------------------ | ----------- | ------- | ------- | ------------------------------ |
| component   | The name of the component.                             | String/Text | -       | -       | Yes, if componentId is not set |
| componentId | The component ID (for components in FlatList item)     | String/Text | -       | -       | Yes, if component is not set   |
| property    | The attribute to be set for the component.             | String/Text | -       | -       | Yes                            |
| value       | The value of the property to be set for the component. | String/Text | -       | -       | Yes                            |

## Output

Note: The component will be updated to show the value that has been set to it.

## Example

In this example, we will set the placeholder attribute of the text input component, where once the button is clicked the text input component will show a placeholder that says "Enter your input!"

### Steps

1. First, we drag a button and a text input onto the canvas.
2. Select the button and under the 'Actions' tab, drag the `Component.setProperty` into the flow for the button.

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-f1e09664a4bc0d65c989c604061dda50d1a6452b%2FsetProperty-step-1.png?alt=media)
3. Under the inspector for this function, select the component whose property you would be changing, which in this example is `TextInput165`.
4. Enter the property to change and the value of the property to display.

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-d65fd80974c1a894a78c9269910a75e79db748a6%2FsetProperty-step-2.png?alt=media)

### Result

1. Save and preview your app.
2. Now when you click the button, it will set the placeholder attribute of the text input component to 'Enter your input!'

   ![](https://399701567-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwmJ1RKjM2uNFaL6fO3Xu%2Fuploads%2Fgit-blob-88a170ee0bbd05dc0f4f1a5e19d999c1bb955416%2FsetProperty-result-1.png?alt=media)

## Links

### Related Information

See also:

* Functions
  * [Component.getProperty](https://github.com/OrangeKloud/emobiq-documentation/blob/master/document/client/gitbook/2-5-actions-and-visual-logic/action-reference/react-native/Component/getProperty/getProperty.md)