COMO FAZER UM MODAL COM REACTJS

Neste vídeo eu uso uma lib chamada react-modal para mostrar como se faz um modal no reactjs.

Puro não sem foi meu enorme sem biblioteca você precisava de muita coisa você precisa fazer várias coisas no css tudo mais mas com as libs do yeti deixar as coisas bem mais fácil para a gente ir programa lá então hoje eu vou mostrar como é que se usa uma das letras é ritmo não é talvez você conheça talvez não eu vou mostrar como é que se usa ela como é que

Faz para configurar e tudo mais primeiro você tem né que instalar no meu caso é yarn at ecos modão bom ano vou estar lá porque eu já instalei mas você vai instalar eu no seu provavelmente vai pedir para você instalar o rouba tarde aqui ó se você tiver usando tá escrito na casa então você tem que instalar também adicionar na sua coisa para poder e para ele

Poder funcionar de página está a reconhecer o typescript e bom acho que é só isso eu não vou na casa porque eu faço né mas isso tanto faz pode ser css eu não vou mexer com ele então vamos começar aqui primeiro a gente vai importar o modelo né então vamos importa modão e aí e é isso você quer um e depois vai importar e o stitch você já vão ver isso tudo

Que eu tô vendo aqui ouvindo a documentação rapaziada ela não decoro tudo sempre quando além do mais que essas biblioteca fica sempre atualizando então se você tá vendo esse vídeo depois de muito tempo acho bom você dar uma olhada na biblioteca na documentação do jackson morreu porque eles podem ter mudado algumas coisas então vamos lá continuando aqui na

Sua pasta ep se você tiver fazendo um componente e no caso você vai ser qual você vai ter que colocar na sua pasta e contar sx viu a pasta principal aqui é isso aqui modo há 47 a pena mente é que você vai colocar aquele de que fica bem aqui no caso de todo mundo quando eu queria no crush ep elementos eu não quero check-up vem rute então você só coloca o restante

Você que é obrigatória só opa colocar aqui e aqui a gente vai já coloca na nossas funções para o primeiro na verdade a gente vai ter que fazer um é um estado né model e ontem oi perla a7s outro estado para quando para gente ir lá e para abrir o modo na casinha e vocês vão ver já como é que funciona isso aqui sempre no estado já expliquei isso não vejo mais no

Primeiro você coloca o valor e depois o valor que ele vai ficar na hora que ele mudar então aqui a gente colocou falso e ele vai ficar um booleano esse aqui vocês vão entender porque aqui na hora que eu fizer as minhas funções é correndo open o dó e eu vou colocar sexo ezopen já entrou oi e aí ele vai mudar o estado de foz para ele começa com falso nós iniciar a

Aplicação e já ia ficar com o rodou aberto né então eu não vou colocar sócio e horrendo eu moro aqui no botão aqui que a gente vai fazer oi oi livre vamos lá o rapaz nesse novo como tá aqui tá bem simples né só para poder mostrar como só um botão problemas vou mostrar como funciona então não asunción mando a copa prol modal 17 isoplan o sol é bem fácil

Na verdade a sua vida até que é muito boa que ela facilitam muito a nossa vida na questão aqui e aqui vem a customização essa como estou customização aqui eu posso copiar ela eu literalmente não não sei muito bom é bem os tom bem simples velho você quer ouvir na documentação também então gostando estado igual a e ontem como é que você vai colocar no top

Em cinquenta por cento tem como você fazer também para o css nós vou fazer do jeito que tá na documentação se vocês quiserem de um jeito diferente comenta em mas eu vou fazer desse jeito é bem simples né então precisar e como projeto é bem pequeno aqui e eu preciso fazer uma pasta sobrou isso não a high e antes de eu terminar de isso aqui na verdade vou fazer

Só isso aqui que eu ja comecei mas ainda não terminei aqui eu vou fazer o modo mostrar para vocês como ele é puro né mas vai ficar então vamos lá agora aqui no botão eu vou colocar um clipe e na pessoa que cá vai disparar essa função aqui quando eu tenho 11 e aí aqui embaixo do botão vai tal modo a copa me manda um se você abre ele aqui e aqui dentro do mundo

Tem a cada bem as suas tudo aqui vem nele aqui na ó na na biblioteca que você tem que pôr então eles outro é o hendel e é horrendo o stop amores opa cálcio é que eu é um request rose vai ser handle me” oi rose mula é estar eu não vou colocar esse aqui por enquanto mas aqui já dava para apoiar querendo muito você coloca o que que você quer que eu fique aqui

Então sei lá h2.com hello é um botton que é sempre bom eu vou dar uma força né o mesmo com ele vocês vão ver quando você vai ficar fora ele isso é cheia então não é automaticamente você da biblioteca se não precisa configurar nada se vocês vão ver quando você clicar forma ele vai fechar então não preciso dizer é bom né porque eu vou então é é bom

E é vendo próximo não é tão difícil não aconselho você se vai fazer uma aplicação colocar ah entendi a empresa de nessa e aí eu tô fazendo igual do documentação e aqui e conforme o tanto faz para não ficar tomando tempo aqui vocês entenderam o que eu quis dizer aqui agora é eu acho que tá bom e aqui eu vou entrar na nossa aplicação ou clicar e aí viu

Apareceu aqui todo mundo essa parte de dentro aqui caso eu fecho aqui viu que eu disse quando aperta aí do lado ó e aqui as estilização o que eu vou colocar agora é aquele lá eu mudou puro na casa sem eu pa abrir a senha utilização eu não coloquei ainda o estável nele aqui e aqui ó tá igual eu gosto mostrar a bom dia que eu terminar você viu como é que você vai

Ficar depois de terminar de sei lá bota um e aí só falta e esse rite alto e bota alto é para é dentro do do próprio com pênis naquela você não tava não e ele muda lá dentro como é que vai ser tá margem e se eu quiser colocar outra coisa eu não sei se você tinha funciona porque eu não tenho ela vamos ver se tem o próximo 1 ah não então tá fazendo escola

A documentação margem tu vem o número 50 por sax e aí se transforme e aí e é aqui um translation in e essa parte que eu não sei porque eu vi na verdade que faz ele deixa mais centralizado é mas não sei dizer o motivo é eu também estou é realmente essas coisas a gente já segue direto viu eu pagar e é aqui e os aquele tá pequeno porque tem pouca coisa nesse se

Eu for colocando lá alguma coisa que eu posso alterar também ali haha e a outra mais dele mas se eu for colocando as coisas que ele vai aumentando também conforme eu coloco só sei lá colocar um form form e aí bom né que não falar meu celular qualquer um escute e sem nada mesmo só para ficar lá a manta bota e aí o arkansas então nega olha esse aumentando então

É basicamente isso quando você clica aqui vendo e a esse eu o ritmo do rapaz ela se você quiser em de outro jeito igual por que tão longe quando é um modelo não aplicação grande a gente faz assim a gente cria ou componente e coloca na pasta central no global styles para utilizar e tudo mais é porque ele ele vai ficar na aplicação toda basicamente dependendo do

De onde você tá de como você tá fazendo aplicação então diferem muito mas basicamente é esse essa é a biblioteca uft moodle valeu por ter assistido até mais é e aí

Transcrito do video
COMO FAZER UM MODAL COM REACTJS By Community Code

Posts Relacionados:

BOTOX CAPILAR DE CHUVEIRO | COMO FAZER E COMO FICOU? | APROVADO OU NÃO??| – Evelyn Carmelim Como Fazer Intro 3D Igual De Pc Para O Android|Como Criar Intro Personalizada Pelo Cell Como preparar e aplicar Benzetacil, como fazer injeção Intra-muscular, adm IM DESIDRATAR PARA SECAR – COMO FUNCIONA E COMO FAZER *com coach rubens*