Começar com o React Router

1. Aplicativo iniciante: Então agora vamos ver como implementar roteamento como uma bruxa navega entre páginas com reagir. Então isso não vai ser um único pedido de praia. Terá vários componentes, componentes, componentes, várias exibições manipuladas por componentes. Então vamos fazer é alternar entre componentes. E sempre que temos uma correspondência confiante de um euro correspondente a um caminho que definimos, ele vai exibir a representação visual de um componente. Então vamos ver como montamos isso. Então eu estou fornecendo como recursos que eu estou fornecendo com, hum mas Miriam disso. Ok, então eu estou desfilando com nossos modelos, então como código de placa para que você não precise digitar do zero. Então, o que teremos em nosso aplicativo de página derretida é uma página para o display home Teoh . Apenas uma página inicial básica. Eu nem me lembro exatamente o que é, mas isso é como, simples você pode ver. Então temos a visão de contatos com o formulário e uma seção sobre sobre competente com alguns MIPs menores aleatórios indexados para representar sobre Paige uh, e então algum estilo bem no CSS sequestrado. Então vamos em frente e criar em seu aplicativo, então eu vou certificar-me de Cindy para CD no deck coisas. E a partir daqui, eu vou criar reagir, e eu vou chamar este um roteamento de quase duas páginas aplicativo exatamente como você gosta. Certo, então teremos um novo projeto montado. Está sendo andaime. Ok, concordo. E então vamos pegar este e abrir em visual. Poderia ser estúdio. Aqui está. E lá dentro. Então, vamos ver os modelos iniciais básicos. Podemos começar a subir. E quando estivermos prontos, vamos começar a completar o up. Quero dizer, criando novos componentes. Isso vai ser o ponto de partida aqui atrás. Então você tem esse logotipo do que um texto e um link que diz aprender, reagir. Então, vai ser diferente. Claro, o que vamos fazer é eu vou convidá-lo para baixar. Então, se você ainda não fez, Então isso é o que você deve baixar dos recursos sujos esta pasta de roteador mundo com toda a capa boilerplate que irá usar para criar uma nova página, os novos componentes. E vamos fazer isso. Hum, apenas até este vídeo 2. Stack de navegação: assim, como explicado antes. Então eu estou fornecendo com código boilerplate que será usado para criar as vistas. Terá um ponto de vista para a casa, Outro para a página de contato, como um formulário e outro para a seção sobre. Mas antes disso terá uma primeira página onde teremos uma navegação no topo, e esta navegação terá links para permitir navegar de um enorme outro. Então vamos começar com isso. Vamos para o nosso Abdel Jets. Então é aqui que vamos fazer algumas mudanças. Não vamos ficar com algumas coisas, mas não vamos ficar com tudo. Não vamos ficar com algumas coisas, Então, na verdade, isso jorra, tudo isso você pode remover, e em vez disso, o que teremos é uma lista em ordem. Ok, então isso é para que ele simplesmente vá embora porque é como, recarregar. Por enquanto, não temos mais nada. Mas em vez disso, o que teremos é uma lista de pedidos e itens de lista, e eu imposto para criar um link e dentro teremos um ataque ANC para criar para habilitar a navegação. Então, por agora, só vai ser isso não vai ser navegando, e eu vou ter primeiro em casa. E então, assim como o propósito é navegar de uma praia para outra, então teremos casa e depois teremos cerca e contatos. Ok, vamos ver. Aqui vamos nós. Muito básico por enquanto. Não faz nada porque não colocamos links reais. Quero dizer, endereço para navegar para o que vai fazer. Além disso, o estilo adicional fará uma visita rápida ao bootstrap get que vêm. Vai ser mais simples para o layout. Também destes exemplo destas aplicações. Eu gostaria de usar os recursos de bootstrap, então vamos usar o cdn mais rápido. Não precisamos baixar as faltas. Em vez disso, vamos buscar o que precisarmos de um euro remoto. Então vamos copiar isso para a área de transferência e depois voltar para o ah, desta vez, ir para a pasta pública e encontrar o índice que HTML e direitos antes do título Você vai colar isso. Ah, nós realmente não precisamos dos roteiros. Vamos apenas manter este estilo cagalhão. O fim de semana dos roteiros vai porque não vamos fazer isso. Nós estaremos fazendo isso interativo com qualquer Jazz Javascript plug ins vai usar o CSS apenas para pres Trump e nós vamos usar um. Uma vez que você esta regra, que será um estilo não-A, eu acho que ele se lembra e estilo uma lista em linha. Uma vez que você esta regra, que será um estilo não-A, Bom. Na verdade usado tanto porque o que eu gostaria de fazer é remover o outro padrão menos um estilo que, mas também para fazer o mínimo em nove. Então um ao lado do outro e não em cima um do outro, porque por padrão e uma tag light é um bloco um ataque de bloco, que significa que ele vai para a próxima linha. Queremos que eles fiquem próximos um do outro. Então eu tenho uma lista na fila que eu acho que é aqui que você não tem tipografia aqui atrás. Então você só precisa realmente usar essas classes para a lista ordenada, a fim de fazer a sua estadia na linha apenas como este exemplo aqui. Então vamos fazer isso há um ano. Na verdade, eu vou datilografar porque certifique-se de digitar o nome da classe em vez de classe, e ele vai ser alugado na vida. E eu acho que ele removeu o padrão também. O tipo mínimo padrão. Então nós realmente não precisamos especificar isso. E apenas na linha, uh, uma coisa pode não ter feito ainda e chegar a um especificado também. Então, para a nossa classe, para cada item mínimo. Então nós vamos pegar isso e fornecer com um forte classe cada item da lista, bem como a fim ter este resultado final muito bom. E aqui atrás, então você tem sua lista à luz. Então isso é ótimo. Bem, fazer bem é adicionar um pouco, eu acho que margem para o topo. Mas o que vai fazer Quicker? Uh, vamos verificar novamente. Então esses recursos que estou fornecendo, você vê que você tem esses CSS sequestrados. Podemos usar isso porque você tem um estilo básico que eu estou fornecendo. Acho que estou adicionando alguma margem ao topo em algum momento. Não tenho certeza, mas de qualquer forma, se não for o caso, vamos adicionar. Você vê a margem tão bem nisso, que estou provando apenas uma utilidade. Então usamos isso. Então eu vou copiar tudo isso e substituir as regras CSS que eu tenho nos modelos iniciais fora do novo aplicativo e substituir, e isso vai fornecer regras CSS. Scilingo, por toda a seção que estamos prestes a criar, eu acho, para as páginas de contato. Bem, talvez. Ou talvez não. Mas apenas para o sobre, OK, então não precisamos se preocupar muito com fora para personalizar a página e imediatamente irá adicionar essa margem. Vou adicioná-lo, na verdade. Bem aqui, Sr. Isso e nós deveríamos ver, tipo, ok, aqui vamos nós. Então agora temos uma pequena lacuna. É apenas 30 pixels 30 Eu acho que não apenas 20. Eu poderia ter encontros e fazer maior para adicionar mais lacuna. Ok, ótimo. Então vamos adicionar mais estilo A algum ponto, porque eu gosto de ter mais espaço em torno dos links também, mas por enquanto , vamos apenas trabalhar com isso. Porque o que eu quero fazer é criar imediatamente novos componentes para cada link correspondente. Então teremos uma vista para a casa. Outro para o sobre e outro para o contato. Você. Então vamos fazer isso a seguir 3. Definindo as rotas: Então agora dentro de suas aplicações. Então vá para a fonte, Boulder e criando você pasta Componentes. Este incluirá todos os componentes. Eu estava começando com esquivações de casa e quarto que eu estou fornecendo com, um, um, um, básico, hum, eu estraguei tudo. Casaco de boilerplate, agarrar o touro dele. Vamos ser importantes lá. Reagir a partir de reacções e ganância em sua classe. Então classe casa e nós vamos estender de reagir para criar acompanhamento Você também pode, uh, uh, fechar alguns estendidos de reacções em Riyadh componente estende componentes vermelhos Minha cama Isso é um extrato que você palavra que nós não precisamos Você também pode importar diretamente de componentes E apenas meio a estas marcas carregadas e então em vez dentro lembre-se que você sempre precisa de métodos Orender e dentro de renderização, você vai retornar o visual para os componentes solares. Então vamos abrir as mensagens. Podemos abri-lo aqui e simplesmente copiar e colar este no retorno interno. E não se esqueça de também exportar sua classe e nós vamos realmente especialistas assim por padrão, assim e por dentro. Teremos estados também para cada componente, e isso será apenas informação. Isso é sobre o título, o título, e nós vamos ler para casa, ok? E o próximo. Ah, o que vou fazer é eu gosto de exibir um, mas não só agora. Então o que vamos fazer é usar um roteador para exibir esses componentes um de nossos cliques em um nick. Mas, por enquanto, precisaremos fazer alguma configuração. Não está terminado. Não vai ser possível imediatamente mostrar para casa do ducado a menos que façamos algo assim, uh, uh quero dizer, não vai ser navegação, mas o que podemos fazer é importar para casa de casa em Este. Este componente está dentro. Os componentes especificarão a morte exata, e então simplesmente usarão, por exemplo, , a aderência personalizada e, em seguida, mostrarão a casa. Isso deve funcionar. Acho que posso ter ocorrido no mar. Tenho uma extracção aqui a fechar o Deve. Bem, talvez não defeituoso. Ok, ok, vamos remover isso. Vai ser o Div. E como, então Oregon eu vou simplesmente colocá-lo aqui. Ok. Ok. Então, em casa. Quando voltarmos para a vista, você verá que terá um Oh, vamos voltar para casa para corrigir o erro. Mas em vez de ter um sinal de igualdade, vai estar aqui, Colon. Eles são atrás. Vamos remover isso. Tem de volta. E aqui você pode ver a página que corresponde à vista para a casa. Vamos fazer o mesmo por cerca de. Vamos criar um novo componente para a seção sobre, e temos mais. Teremos mais texto para falar, então isso fará mais sentido. Então dizendo que vamos criar todo o modelo para criar um novo componente. E em vez de ter outra casa, vai ser por aí. E você ia ler sobre isso e vamos abrir o texto. Quero dizer, o modelo que corresponde ao sobre confiança. Copiar. E vamos substituir aqui e agora de volta para sequestrar GS. Nós vamos importar também a partir desses componentes sobre componente e, em seguida, sobre, e vamos fazer o mesmo. Eu vou realmente substituir e substituir com cerca de e será capaz de ver um, ser sobre modelo para o sobre competente. Vamos ver o que está faltando sobre, Ok, que alguns apenas eu acho que na taxa sobre aqui, eu posso ter um extra hum você que tudo está correto. Ok, provavelmente estou fornecendo uma div extra bem aqui. Vamos subir. Você de novo. Certo, isso é extra-solar. Faça ou tenha que ter certeza de que não tem nada dentro do pai para apreender. Oh, isso foi apenas um erro meu quando eu estava colando ou pode ter um extra, hum, então você sempre foi o OK, aqui vou eu. Margem bem aqui. E isso é o X tenta bem aqui. Ok, então eu vou apenas fazer a correção de qualquer maneira, então sempre que você tem essa falta, você tem então o modelo correto, que é o erro. Certo, então vou me certificar de formatar isso bem. E eu deveria ter mais algum erro. E agora você tem a página que corresponde a, hum Você vê isso? Alguns aqui sobre o que fazemos é aqui substituído porque estamos usando o estado. O que vamos fazer é fazer este título de estado para ter o título correto para esta página, que é sobre Ok, então e então eu só preciso fazer o mesmo também. Para casa. Vou substituir por este afirma este título estadual. Ok, há a unicidade, uh, muito escura para fazer, que é o contato competente, que eu vou deixar você fazer como um exercício. Então vamos corrigir isso no próximo vídeo juntos 4. Entre em contato - Solução: Então o que eu pedi para você fazer é criar os componentes que correspondem. Para, é claro, quer Teoh a visão de contato. Então vamos para o roteador e abrir este arquivo de texto e você vai em frente e ir para a competência e criar você. Contate Js Fall. Ele vai seguir exatamente o mesmo formato para criar um novo componente bem aqui, em vez de ter cerca vai ter contato. E para o título, vai ser contato também aqui. E vamos substituir com o que temos aqui, que é contato, e isso vai nos dar um bom modelo para um formulário. E eu acho que não há nenhum engano uh, casaco. Isso é ótimo. E é substituído aqui. Vamos ler o título real desta página para esta página, este título de estado. Vamos tentar isso para ver se isso está funcionando corretamente. Em vez de importar, vamos importar primeiros contatos, ter acesso a este componente e em vez de ter aqui sobre, teremos contato. E porque já estamos usando essa cinta este check-out novamente já levantando bootstrapped. Eu vou ter um bom modelo graças ao que atingiu aqui. Ok, ótimo. Mas o propósito aqui é poder navegar a partir de um futuro. Outro usando este links, e isso é o que vamos fazer em seguida vai ver, também. Como primeiro vamos ver como a instalação para a rota do roteador React React e links da rota direta A mudo e veremos a idade de uso também. Então, como definir o escreveu os raps. Como você encontrou o caminho para o correspondente, competente e finalmente ajudar a navegar de um continente para outro? Vamos fazer isso a seguir. 5. react-router-dom: Então vamos em frente e incutir uma nova dependência. Vês isso nos pacotes? E assim, sempre que você tem um projeto inicial, você tem essas dependências em seu projeto automaticamente. Então, primeiro reage você. Você precisa disso para, hum, ser ótimo. Quero dizer, para construir um naufragado. Você tem o reagir tiras burras e diretas, que é este scripts, a fim de começar a construir sobre. Até agora. Então este é o Isto corresponde à linha de transformação limpa. E agora, no Abda. Jess, o que vamos fazer é, hum, na verdade, vamos usar o console, a consulta integrada. Vou abrir um novo terminal para não precisarmos matar o servidor. Então ele ainda vai estar rodando no host local 3000. Então você vê que este é o anfitrião local Stalin. Então isso está correndo sobre isso no esporte. O que vamos fazer é eu abrir no seu terminal, e eu vou rodar seu próprio anúncio, reage roteador burro, e você vai ver que está no seu pacote. Jason, você tem que conectar o recibo como este é um prédio aqui, ele vai adicionar uma nova dependência dentro de dependências. Você vai ver. Reagir roteado, hum, e a versão para essas dependências. Então isso é bom é que agora temos acesso ao reator por burros. Então, qualquer coisa relacionada com o caminho de navegação roteador links extra está em um módulo separado com reagir. Não está no mesmo modelo que reagir e reagir a eles. Então, precisamos ter certeza de instalar este separadamente. E agora que temos este nos módulos não, vamos verificar isto. Devemos ser capazes de encontrar no ou assim toda a dependência que precisamos realmente criar. Hum, a estrada. Implemente o roteador. Aqui vamos nós. Reagir, rotear e reagir roteou-os. Então é disso que precisamos. Certo, então vamos voltar para o Abda, Jess. Agora, o que vamos fazer é importar a partir deste novo módulo que temos instalado, e vamos certificar-nos de terminar para especificar o roteador do navegador como um corredor, e este poço nos dará acesso ao histórico. Então, quando você navega para um caminho e você precisa voltar, vai ser tratado pelo navegador Roeder porque ele vai manter o controle do histórico navegação. Então teremos rotas para definir as rotas e o caminho e o poço de Milliken, então os links serão o equivalente a um ataque ANC de sempre que você precisar criar um link com Roger. Com o link, você especificará um caminho para navegar. E agora vamos importar do Roteador React Rotterdam. Exactamente. Então o que você precisa fazer agora é definir as rotas e será isso aqui mesmo. Então este será o primeiro passo. Assim, cada wraps irá para incorruptibilidade para especificar um caminho. E para este, na verdade, eu vou começar por especificar os componentes e você vai entender. Então este será para a casa 1º 1 e para a casa basicamente terá a rota passada , que significa que não vamos especificar nenhum ponto final. Vão ser as raízes. Quero dizer, o euro principal para um 2º 1 nós vamos especificar uma rota para o sobre, você e é uma semana não são bem corresponde ao sobre. Você verá que isso está realmente destacado. Isso corresponde aos componentes sobre. Então, para qualquer link de rotas correspondente a este caminho que definimos como sobre isso, este será o ponto final sobre o qual irá especificar as navegações para o componente about. Vamos fazer o mesmo para contatos, e isso será o contato final. Nós especificamos que queremos exibir a empresa e, claro, claro, deve entrar em contato com a área. Então essas são nossas rotas, e nós absolutamente precisamos envolver as rotas e isso será usado como um interruptor. Você poderia entender. Então, roteador. Então este será o rapper de todas as rotas. Então, certifique-se de encapsular tudo isso, hum, dentro do roteador, e este vai funcionar como um switch. Então dentro da estrada ou você define o caminho. E quando você selecionar a casa, , por enquanto é só a rota, mas vamos definir os links depois disso. Mas quando você seleciona um link que corresponde ao caminho como este, o caminho passado vai mudar para o pacto de casa. E quando você seleciona um link que corresponda a isso sobre endpoints, ele mudará para o sobre a empresa. Então isso não é tudo. Quando você olha para a vista, um, tem um tipo de aqui. Quando você olha para a vista não muda nada por agora, você tem o mesmo Mas o que queremos é definir o lince, o lince, que serão esses. Então, por enquanto, só temos algo estático. Quando você teve links dinâmicos? Então vamos configurar isso bem aqui em vez de ter links como então vamos definir dentro. O e eu íamos substituir os ataques do ANC por ligações. Vou pôr isso lá fora, por enquanto. Vai ser este elo, e vai ter o seu tem. Cada link tem uma propriedade que é para e dentro dos dois como um valor, você vai passar o caminho real para o qual você deseja navegar aqui e depois dentro. Você especifica o texto para esse link. Então eu vou substituir tudo isso por nós vamos copiar, entrar em X e, em seguida, ritmo para substituir o ataque ANC. Você vai substituir por este link e vamos fazer o mesmo com os outros. Então casa primeiro e depois próximo vai ser sobre isso para o sobre o que você especifica é o caminho sobre e substituído pelo nome correspondente e contato para a última área de contato . Assim, sempre que você selecionar um link, você verá que ele vai selecionar. Ele vai ver se um caminho corresponde ao ano do link, o caminho do especificado aqui, e então exibir a confiança correspondente. Então, a fim de ser capaz de energia fazê-lo funcionar, nós vamos precisar embrulhar. Veremos que você comete um erro. Enfim, Enfim, esse Lincoln estaria fora do roteador. Vamos precisar mover este roteador. Nós vamos precisar mover isso para cima, a fim de incluir tudo isso. Assim, como especificado antes que ele funciona como um interruptor. Então precisamos ter tudo isso encapsular os links e as rotas correspondentes que definimos abaixo, assim. E vemos que quando mudamos de um para outro e temos a página correspondente. Então vamos precisar fazer algumas mudanças para o lar. Acho que sim,mas para o lar. Acho que sim, Certo, então temos isso. Isto parece ser duplicado. O que fará também é especificar essa palavra-chave tão exata. Então nós sabemos que para as raízes, bomba nas raízes quando eu quero dizer é as raízes de seus projetos. Esta será a primeira entrada, como a página inicial do seu aplicativo. Então, o que corresponde a essas Beth, que é o caminho raiz, vai mostrar a página inicial, a casa confiante, Tiny. Vamos ver. É quando eu seleciono casa bem aqui sobre o contato. E você vê que o euro está mudando. Se eu fizer sobre isso vai mostrar sobre OK, então isso funciona muito bem. Então nós apenas habilitado a navegação usando reagir para roteado, Hum neste up Ah, Budismo re fatoração O que eu gostaria é ter os links em uma seção separada bem aqui. Então vamos fazer isso em seguida. Basicamente, eu poderia explicar isso para você e deixar você fazer isso como um exercício. O que eu costumava ter, um, para reduzir, otimizar o código, torná-lo mais modular por ter sua separado esta seção e também evita, ah, a repetições. Você vê que isso é semelhante. Então você tem três vezes as mesmas tags aliadas, então tente permitir a reutilização para fazer alguma coisa boa, que é reutilizável. Você poderia ter um link separado. Quero dizer outro componente e eu. Então vamos fazer isso a seguir 6. Acabamento: assim como um exercício e só para você não só entender melhor reagir arredondado, mas também para entender o propósito do reator que é usar para implementar e usar componentes reutilizáveis . Faremos isso a seguir. Primeiro. Eu gostaria de colocar tudo isso em componentes separados, competentes e apátridas no mesmo outono. Está tudo bem. O que vamos fazer é criar uma nova confiança apátrida e, em seguida, devolver toda a sua e você verá que não teremos nenhuma mudança por enquanto. Então, se eu for verificar para que eu não vou ter nenhum link, mas vamos voltar e o que vamos fazer é, então, nos referir a ter e vamos recuperá-lo. Aqui vamos nós. Então temos tempo na navegação com você. Então aqui o objetivo é tornar o código reutilizável. E vamos ter outro aqui que vai chamar, não ligar, porque vai entrar em conflito aqui com este Some. Mas podemos chamar de dinheiro. Sim, podemos ligar de volta. Como quiser. Na verdade, poderíamos passar um colega, e aqui ele vai devolver esse tipo, um, modelos é apenas uma mentira, e em vez de ter isso não vai estudar casaco. É que vamos ter primeiro, uma constante. Vamos definir as nossas ligações. Vamos começar com isso é que vamos fazer, encontrar todos os links e como links o que temos sua primeira casa. Então temos agora. Então temos contato. E basicamente, o que faremos é, hum, muito simples. Vamos mapear. Vamos redirecionar sobre todos os objetos, apenas três cada objeto que temos nessa taxa e, em seguida, re aplicar o mesmo tempo assman como temos objeção que matriz re usar o mesmo confiante que será caminho aqui. Então vamos manter apenas a lista de energia aqui. E bem, o que eu vou fazer é colocar todas as letras minúsculas. Vou explicar depois que vai ser minúscula, para começar. E então iríamos usar o caminho e começar sempre com uma vida. E agora vamos passo a passo, e eu e depois, uh, apelido exatamente a mesma coisa que aqui. Isso sou eu. Copie isso. Mas antes disso, precisaremos usar mapas, lembra? Vai ser assim que vai ser um mapa de ligações. E para cada objeto que temos nesses links, nós vamos ter uma variável local, que nós vamos chamar Link, e isso vai esperar e dentro bem aqui. Então vamos usar o link. Então eu vou capitalizar. Vai ser maiúscula para maiúsculas e minúsculas pode usar o Capitalize das tiras da Jena . Lá vai você. Deve funcionar. E para o melhor, o que vamos fazer é usar primeiro, a fim de prestes a combinar simplesmente comer. Então, primeiro texto no meio. Então, usado, empregado, empregado, vinculativo. Então eu vou passar o link dentro do aparelho curvilíneo, como foi precedido por este cifrão. E a coisa é, vamos precisar especificar que para o link no caso, isso é igual a casa. Veremos isso em seguida. Quando eu ia ver se isso está funcionando de qualquer maneira, nós temos o suficiente e nos recuperamos. Capitalize para o vamos ver se isso funciona. Esperado em uma videira 15. Vamos precisar voltar aqui porque não devolve nada. Então ele não entende quando você voltou? Então vamos ver como isso parece. Parece que não funciona. O que vai fazer. Bem, você sabe o que vamos fazer em casa e por aqui? Então vai ser nós vamos para a sala de gelo capital. E desta vez aqui se arrepende da nossa coisa. A única coisa é, o que você, uh, é isso está funcionando muito bem. Não parece incomodar, mas prefiro ter uma ligação no ponto final com a minúscula. Então o que você poderia fazer é aqui, não é? Você poderia em minúsculas? Na verdade, vamos fazer os formatos aqui neste local. Então, em vez de ter o limite mais tarde, toda vez que você mudar de um caminho para outro, vai ser minúsculo. Ok? O lar não parece funcionar. É porque não temos caminho para casa. Você vê que nós não temos. Não especificamos nenhum ponto final com isso. Fascinante. Na verdade, é a rota que precisamos porque sempre que você tem as raízes que você tem isso é o que precisamos. Então o que vamos fazer, vai ser muito simples. Podemos fazer algo como primeiro aqui para verificar. Primeiro, podemos verificar se o link é igual. Teoh está em casa. Muito simples. Vamos checar seu exame físico para casa, e se for o caso, devolveremos nada. Caso contrário, isso é devolvido, Link. Está bem. E agora você só precisa seguir o caminho assim e podemos continuar. Vazamento é apenas para o caminho que precisamos fazer isso porque para o caminho precisamos de algo que corresponde ao caminho especificado. Ok, ok, então vamos fazer isso em casa. Agora. Temos casa que temos sobre casa, e isso está funcionando muito bem. Está bem, Perfeito. Em seguida, para o resto do exercício, porque nós realmente queremos usar um componente reutilizável. Vamos levar tudo isso. E como esses são os formatos finais que esperamos, vamos pegar tudo isso e usar agora caminho. E para este caminho, quero dizer, este novo banho da empresa, vai ser como então queremos que o Teoh passe adereços como crianças porque precisamos que o Teoh use o linchamento. Então vamos fazer isso desta forma. Propriedade vinculativa e o que corresponde à lógica deste passado, vamos pegá-la e adicionar ao caminho porque é mais alérgico colocá-lo aqui e agora, acho que estamos todos bem. Estamos todos prontos. Temos componentes reutilizáveis e achamos que não está definido. Precisamos especificar aqui, que será o adereço que passaremos quando criança. Precisamos especificar aqui, Está bem. E apenas um rápido Centex Eyre gosta, como aqui. Em vez disso, vai ser passado assim. Ok, então agora, em vez de ter, hum, você chegou em casa atrás dela e isso está funcionando muito bem.