Jump to content

Search the Community

Showing results for tags 'materialui'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Web Development
    • HTML e CSS
    • Javascript
    • PHP
    • Ruby
    • Python
    • Java
    • .NET
    • Docker, Kubernets and other environments
    • WordPress
    • Mobile
    • Agile
    • Desenvolvimento de Games
    • Banco de Dados
    • Design and UX
    • Algoritmos & Outras Tecnologias
  • Entretenimento e uso pessoal
    • Segurança & Malwares
    • Geral
    • iMasters's pub

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Found 1 result

  1. Olá pessoal tudo bem? Sou iniciante em React + Material Ui no node.js Quanto ao layout estou indo até que bem. Contudo, hoje me deparei com um problema. Estou fazendo um formulário de login que irá verificar os dados em um BD Mysql. Criei o formulário com hook form e na hora de submeter pretendo passar os dados do formulário por parametro em uma função, ela pesquisar no mysql e retornar o resultado. Contudo, na hora que coloquei funções assincronas que tem Promisse no arquivo que irá conectar com o DB o seguinte erro aparece: Unhandled Rejection (TypeError): Net.connect is not a function Isso depois que coloquei os códigos para conectar o DB. Como faço para chamar funcões assincornas dentro React então? (a chamada está onde está comentado "Aqui chamo a função" Segue o código: import React, { useState } from 'react'; import Container from '@material-ui/core/Container'; import Grid from '@material-ui/core/Grid'; import Card from '@material-ui/core/Card'; import CardMedia from '@material-ui/core/CardMedia'; import { makeStyles } from '@material-ui/core/styles'; import Typography from '@material-ui/core/Typography'; import FormControl from '@material-ui/core/FormControl'; import Input from '@material-ui/core/Input'; import InputLabel from '@material-ui/core/InputLabel'; import InputAdornment from '@material-ui/core/InputAdornment'; import AccountCircle from '@material-ui/icons/AccountCircle'; import Lock from '@material-ui/icons/Lock'; import Button from '@material-ui/core/Button'; import { useForm } from "react-hook-form"; import Alert from '@material-ui/lab/Alert'; const useStyles = makeStyles((theme) => ({ logotipo: { paddingTop: theme.spacing(6), backgroundColor: theme.palette.background.default, margin: '0 auto', boxShadow: 'none' }, logotipoSegg: { margin: '0 auto', width: '30%' }, centraliza: { textAlign: 'center', paddingTop: theme.spacing(4), }, margin: { marginTop: theme.spacing(2), paddingRight: theme.spacing(2), paddingLeft: theme.spacing(2) }, button: { marginTop: theme.spacing(4), } })); export default function Login() { const { register, handleSubmit, formState: { errors } } = useForm(); const onSubmit = data => { console.log(data) document.getElementById('usuario').setAttribute('disabled', 'true') document.getElementById('senha').setAttribute('disabled', 'true') /*** Aqui chamo a função ******/ const usuario = require('../config/Usuario') console.log(usuario.login) }; const classes = useStyles(); return ( <> <Container maxWidth='lg'> <Grid container direction="row" justify="space-around" alignItems="flex-start" > <Grid item xs={12} sm={6} md={5} > <Card className={classes.logotipo}> <CardMedia component="img" alt='Logotipo Live Experience' image='/images/LogotipoLiveExperience.png' title='Logotipo Live Experience' /> </Card> <Typography variant="h1" component="h1">Sistema de gestão para Restreaming</Typography> <Typography component="p" className={classes.centraliza}>Faça seu login para acessar o sistema</Typography> <form onSubmit={handleSubmit(onSubmit)}> <FormControl className={classes.margin} fullWidth> <InputLabel htmlFor="usuario">Digite seu usuário:</InputLabel> <Input id="usuario" {...register("usuario", { required: true })} startAdornment={ <InputAdornment position="start"> <AccountCircle /> </InputAdornment> } /> </FormControl> {errors?.usuario?.type === "required" && <Alert severity="error">É necessário informar seu usuário acima!</Alert>} <FormControl className={classes.margin} fullWidth> <InputLabel htmlFor="senha">Digite sua senha:</InputLabel> <Input id="senha" type='password' {...register("senha", { required: true })} startAdornment={ <InputAdornment position="start"> <Lock /> </InputAdornment> } /> </FormControl> {errors?.senha?.type === "required" && <Alert severity="error">É necessário informar sua senha acima!</Alert>} <Button fullWidth variant="contained" color="primary" className={classes.button} type="submit">Acessar Sistema</Button> </form> <Typography component="p" className={classes.centraliza}><img src="/images/segg.png" alt='SEGG' className={classes.logotipoSegg} /></Typography> </Grid> </Grid> </Container> </>); } E este é começo do código do Mysql que comecei e na hora que coloquei a conexão deu o erro: const mysql = require('mysql2') const connection = mysql.createConnection({ host: 'localhost', user: 'root', password: 'xxxxxxx', database: 'liveexperience' }); function login(dados) { return ('Ok para ' + dados.usuario) } module.exports = {login} Desde já muito obrigado.
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.