Creating components that control other components
How about we provide an interactive component on the page where its values (set by the user) serve as inputs to another function, which is in turn responsible for the final output? Figure 10.4 shows what the result looks like, and following that is a discussion of the details and implementation:
Let's go through the visual elements of this app's layout, one by one:
- Success message: The green strip at the top doesn't appear when the app loads. It only appears after the user adds the options to the dropdown and hits the Set options button. Note that there is a dynamic message showing the user the values that they added. Also, note that the alert message is "dismissable." We have the x symbol on the right, allowing the user to remove this message.
- Instruction line:...