0

Boa noite!

Eu tenho um problema com Javascript, que não importa o que eu faça, nada que eu faço de código emite resultado na tela do navegador. Estou usando React Native, e por enquanto era para aparecer o que eu escrevi na tela importando de outros códigos, caso alguém tenha um link explicando o motivo desse erro ou saiba como resolver, pode me ajudar por favor? Segue abaixo o arquivo "app.jsx":

import './app.css'
import React from 'react'

import logo from '../components/template/logo'
import nav from '../components/template/nav'
import main from '../components/template/main'
import footer from '../components/template/footer'

const app = props => {
    <div className="app">
        <logo />
        <nav />
        <main />
        <footer />
    </div>
    }

    export default app

1 Resposta 1

-2

Podem estar acontecendo algumas coisas no seu código:

1 - O main e o footer são elementos padrões do HTML, nome de componente é sempre com letra maiúscula pra não dar esses erros.

2 - Tenho quase certeza de que o problema é o export. O export pode ser um "export" ou um "export default", a grande diferença é que no "export", vc precisa circular o item que vc quer importar com um {}, ou seja:

   //No componente
    export Nav

   //No App.js
   import {Nav} from '../components/template/Nav'

Se fosse um export default seria:

   //No componente
    export default Nav

   //No App.js
   import Nav from '../components/template/Nav'

Imagino que as alterações que você deve fazer são mudar o nome dos componentes para letra maiúscula, tanto no código quanto o nome dos arquivos, e também consertar essa questão do export. Ai ficaria mais ou menos assim:

    import './app.css'
    import React from 'react'

    import {Logo} from '../components/template/Logo'
    import {Nav} from '../components/template/Nav'
    import {Main} from '../components/template/Main'
    import {Footer} from '../components/template/Footer'

    const App = props => {
        return (
            <div className="App">
                <Logo />
                <Nav />
                <Main />
                <Footer />
            </div>
        )
    }

    export default App

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .