How to pass data from custom component to other components

[jumpei]

I made this text editor on retool using custom component.
And I want to pass input data on "customcomponent1" to "text30"
However I have no idea how to pass that.

I checked this site, but I couldn't understand well.
https://docs.retool.com/docs/custom-react-components

If you are familiar with that, please tell me how to pass data from "customcomponent1" to "text30".

[justin]

Hey @jumpei! To reference data from your custom component, you can use the modelUpdate function in your custom component to set your data, and then reference it throughout Retool with {{ customComponent.model.data }}. The example in the docs runs like this:

 const MyCustomComponent = ({ triggerQuery, model, modelUpdate }) => (
    <Input
        color="primary"
        variant="outlined"
        value={model.textInputValue}
        onChange={(e) =>
          modelUpdate({ name: e.target.value })
        }
    />
  );

You can see that in the Input component, we’re running a function via the onChange prop (see the Material UI docs here) that updates the custom component’s model to add a “name” field with a value of target.value. If you had named this custom component customComponent1 you’d be able to reference this property with {{ customComponent1.model.name }}.

Does this help?

[jumpei]

Hi Justin,
thank you so much for your tips!!
I'm gonna try that
Jumpei.