5
respostas

Problema no console

Ontem estava tudo funcionando, ai quando entrei hoje, apareceu esse Warning no console sem eu ter feito nenhuma alteração no projeto e a timeline não quer aparecer. Nao aparece mais nada no console, apenas isso.

index.js:1446 Warning: React does not recognize the `computedMatch` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `computedmatch` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in div (at src/index.js:23)
    in Switch (at src/index.js:22)
    in Router (created by BrowserRouter)
    in BrowserRouter (at src/index.js:21)

Meu index.js esta assim:

import React from 'react';
import ReactDOM from 'react-dom';
import './css/reset.css';
import './css/timeline.css';
import './css/login.css';
import App from './App';
import Login from './componentes/Login';
import Logout from './componentes/Logout';
import {BrowserRouter as Router, Route, Switch} from 'react-router-dom';
import {matchPattern} from 'react-router/lib/PatternUtils';

import * as serviceWorker from './serviceWorker';

function verificaAutenticacao(nextState,replace) {
    const resultado = matchPattern('/timeline(/:login', nextState.location.pathname);
    const enderecoPrivadoTimeline = resultado.paramValues[0] === undefined;

    if(enderecoPrivadoTimeline && localStorage.getItem('auth-token') === null) {
        replace ('/?msg=você precisa estar logado para acessar o endereço');
    }
}

ReactDOM.render(
    (
    <Router>
        <Switch>
            <div>
                <Route exact path="/" component={Login} />
                <Route path="/timeline(/:login)" component={App} onEnter={verificaAutenticacao} />
                <Route path="/logout" component={Logout} />
            </div>
        </Switch>
    </Router>
    ), 
    document.getElementById('root')
);

serviceWorker.unregister();

Já procurei no fórum e não algo que se encaixasse, e o que achei procurando na internet, fiz algumas alterações, mas não resolveu. Então voltei com o código do jeito que estava, e conforme esta na aula e na transcrição.

Se alguém puder me ajudar!! Obrigada.

5 respostas

Oi Marcela tudo certo ?

O projeto está funcionando normalmente ?

Olá Felipe!

Não! Apenas a parte de Login funciona. A timeline continua não funcionando, e a mensagem permanece no console.

Oi Marcela, tudo bem? Desculpa a demora, mas você pode me dizer que versão do Router e do React você está usando pra eu conseguir te direcionar pra solução por favor?

Meu package.json está assim..

{
  "name": "instalura",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "generator-electrode": "^5.1.2",
    "gulp": "^4.0.0",
    "immutable": "^4.0.0-rc.12",
    "npm": "^6.8.0",
    "pubsub-js": "^1.7.0",
    "react": "^16.8.1",
    "react-dom": "^16.8.1",
    "react-redux": "^6.0.0",
    "react-router": "^3.2.0",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.5",
    "react-transition-group": "^1.2.1",
    "redux": "^4.0.1",
    "redux-thunk": "^2.3.0",
    "yo": "^2.0.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

Oi Marcela, tudo bem? De acordo com a documentação, os elementos filhos de <Switch> devem ser <Router> ou <Redirect> e você tem um div, ali. Remove essa div pra gente ver se é isso ou tem mais alguma coisa.