Menu
as is defined as An element type to render as (string or function). in the most of the components in semantic-UI-react. What does that mean?
My understanding is that it somehow changes the component in whatever is as is.
Example:
https://react.semantic-ui.com/modules/sidebar
has Sidebar as={Menu} then the children are <Menu.Item name='...'> without typical <Menu/> that is required to start the menu.
958
Props are arguments passed into React components. Props are passed to components via HTML attributes. props stands for properties.
In a nutshell, props are used to pass data from a parent component to a child component in React and they are the main mechanism for component communication.
What are props in React? We use props in React to pass data from one component to another (from a parent component to a child component(s)). Props is just a shorter way of saying properties. They are useful when you want the flow of data in your app to be dynamic.
Props and PropTypes are important mechanisms for passing read-only attributes between React components. We can use React props, short for properties, to send data from one component to another. If a component receives the wrong type of props, it can cause bugs and unexpected errors in your app.
This feature is called augmentation, you can control the rendered HTML tag or render one component as another component. Extra props are passed to the component you are rendering as. It allows to compose component features and props without adding extra nested components.
Your example with Sidebar shows that Sidebar will render its children to Menu. This can also be written in the following way, but this procudes extra markup, which is not always correct and possibly can break styling.
<Sidebar>
<Menu>
<Menu.Item />
</Menu>
</Sidebar>
Basic example with tags:
<Button /> // will produce <button class='ui button' />
<Button as='a' /> // will produce <a class='ui button' />
Example with react-router:
<Menu.Item as={Link} to='/home' /> // will produce <a class="item" href="/home">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
