Como fazer para criar um Tab component (abas) no React ? Preciso organizar os atributos de um form já existente em abas (tabs).
Como fazer para criar um Tab component (abas) no React ? Preciso organizar os atributos de um form já existente em abas (tabs).
Opa, tudo bem? Cara teria como colocar o código que você tem para entender melhor a sua questão.
Oi Nathan, obrigado pela resposta ! Consegui ajuda para fazer esta tarefa, vou colocar uma parte do codigo aqui :
import { Button, Grid, Typography, AppBar, Tabs, Tab } from '@material-ui/core';
import { TabPanel } from '@material-ui/lab';
import React, { useEffect, useState } from 'react';
import { useDispatch } from 'react-redux';
import { clearForm, clearErrors } from '../../actions/formActions';
import PrivateInputWrapper from '../../components/inputs/PrivateInputWrapper';
import useSubmitForm from '../../components/useSubmitForm';
import scheme from './scheme';
import schemetabs from './scheme-tabs';
import { useFormStyles } from './styles';
import { makeStyles } from '@material-ui/core/styles';
import axios from '../../utils/axios';
import { openSnackBar } from '../../actions/snackBarAction';
import { useHistory } from 'react-router-dom';
import DateFnsUtils from '@date-io/date-fns';
import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';
import { KeyboardDatePicker, MuiPickersUtilsProvider } from '@material-ui/pickers';
import Box from '@material-ui/core/Box';
import PropTypes from 'prop-types';
import './Formulario.css';
const Formulario = ({ template }) => {
const classes = useFormStyles();
const history = useHistory();
const submitForm = useSubmitForm();
const dispatch = useDispatch();
let [holidayList, setholidayList] = useState([]);
const handleSave = async values => {
try {
const id = template?.id;
scheme.concat(schemetabs);
const payload = createParameter(values, scheme);
console.log(payload);
if (id) {
await axios.put(`/v1/mdc/template/${id}`, payload);
} else {
await axios.post('/v1/mdc/template', payload);
}
dispatch(clearForm());
setholidayList([{ date: null }]);
dispatch(clearErrors());
dispatch(openSnackBar('Sucesso ao salvar', 'success'));
history.push('/templates');
} catch (e) {
dispatch(openSnackBar('Falha ao salvar', 'error'));
}
};