React Rebass Forms Componente de radio

React Rebass es un framework front-end que fue diseñado teniendo en cuenta a React. En este artículo, sabremos cómo usar el componente de radio en React Rebass. La Radio es un componente importante que se requiere en cada desarrollo. Entonces, para crear un componente de Radio, podemos importar el componente Rebass Radio.

El componente Form Radio se utiliza para crear un elemento accesible y temático en el que los usuarios pueden seleccionar algún valor.

Sintaxis:

<Radio />

Creación de la aplicación React e instalación del módulo:

Paso 1: Cree una aplicación React usando el siguiente comando.

npx create-react-app foldername

Paso 2: después de crear la carpeta de su proyecto, es decir, el nombre de la carpeta, muévase a ella con el siguiente comando.

cd foldername

Paso 3: Instale React Rebass y forme componentes en su directorio dado.

npm i rebass
npm i @rebass/forms

Estructura del proyecto: Tendrá el siguiente aspecto.

Ejemplo 1: Este es el ejemplo básico que muestra cómo usar el componente Form Radio.

import React from 'react'
import { Label, Radio } from "@rebass/forms";
  
const gfg = () => {
    return (
        <div>
            <h2>GeeksforGeeks</h2>
            <h5>React Rebass Radio Component</h5>
            <Label>
                <Radio
                    name='gfg'
                />
                Python
            </Label>
            <Label>
                <Radio
                    name='gfg'
                />
                C++
            </Label>
            <Label>
                <Radio
                    name='gfg'
                />
                JavaScript
            </Label>
        </div>
    );
};
  
export default gfg;

Paso para ejecutar la aplicación: ejecute la aplicación desde el directorio raíz del proyecto, utilizando el siguiente comando.

npm start

Producción:

Referencia: https://rebassjs.org/forms/radio