React Suite <Button> Props
A React suite is a library of React components, sensible UI design, and a friendly development experience. It is supported in all major browsers. It provides pre-built components of React which can be used easily in any web application.
In this article, we’ll learn about React suite Prop Button. <Button> component is used to add a button in a react application.
- active: It changes the button state to active.
- appearance: It denotes the appearance of the button.
- as: It is used to add a custom element to a button.
- block: It is used to span the full width of the Button parent.
- children: It denotes the primary content.
- classPrefix: It denotes the prefix of the component CSS class.
- color: It denotes the color of the button.
- disabled: It changes the button state to disable.
- href: It is used for providing a href attribute.
- loading: It shows a loading indicator.
- size: It denotes the size of the button.
<Button appearance="subtle" size="lg" colored="red" disabled> Default </Button>
Creating React Application And Installing Module:
Step 1: Create a React application using the given command:
npm create-react-app projectname
Step 2: After creating your project, move to it using the given command:
Step 3: Now Install the rsuite node package using the given command:
npm install rsuite
Project Structure: Now your project structure should look like the following:
Example 1: Below example demonstrates the appearance, size, active <Button> props.
Example 2: Below example demonstrates the disabled, loading <Button> props.