Реагировать на предупреждение computedMatch относительно некоторых проблем?

Из React док

The unknown-prop warning will fire if you attempt to render a DOM element with a prop that is not recognized by React as a legal DOM attribute/property. You should ensure that your DOM elements do not have spurious props floating around.

Внутри компонента <Switch> вы увидите строку ниже.

React.cloneElement(child, { location, computedMatch: match })

В этом случае child - это ваш <div></div>, поэтому нестандартные реквизиты computedMatch передаются на собственный внутренний узел <div>, поэтому React выдает вам здоровое предупреждение. Таким образом, использование <> или <Fragment> сбросит предупреждение.

Я решаю эту проблему с тегом Удалить<div> внутри тега. или заменять<div> с <React.Fragment>.

в таком случае :

import React,{Component} from "react";
import {BrowserRouter as Router, Switch, Route} from "react-router-dom";
import LogoutHome from './Logout_Home';
import SignIn from '../Components/SignIn';
import jwt_decode from 'jwt-decode';
import {setCurrentUser} from '../actions/authActions';
import SignUp from '../Components/SignUp';
import setAuthToken from '../util/setAuthToken';
import AboutUs from '../containers/AboutUs';
import store from '../store';
import {connect} from "react-redux";
// check for TOKEN
if (localStorage.jwtToken) {
  // Set auth token header auth
  setAuthToken(localStorage.jwtToken);
  // Decode token and get user info and exp
  const decoded = jwt_decode(localStorage.jwtToken);
  // Set user and isAuthenticated
  store.dispatch(setCurrentUser(decoded));

  // Check for expired token
  const currentTime = Date.now() / 1000;
  if (decoded.exp < currentTime) {
    // Logout user
    store.dispatch(logoutUser());

    // Redirect to login
    window.location.href = '/login';
  }
}
class HomePage extends Component
{
  componentDidMount(){
    console.info(this.props.auth.isAuthenticated);
  }
    render(){
      var {
        isAuthenticated
      } = this.props.auth;
      return(
        <div>
          <Router>
            <div>
              <Switch>
                {this.props.auth.isAuthenticated===false ? (
                  <React.Fragment>
                  <Route exact path='/' component = {LogoutHome}/>
                  <Route  path='/Finance/Login' component = {SignIn}/>
                  <Route  path='/Finance/AboutUs' component = {AboutUs}/>
                  <Route  path='/Finance/ContactUs' component = {ContactUs}/>
                  <Route  path='/Finance/SignUp' component = {SignUp}/>
                  <Route  path='/Finance/Forgotpassword' component = {Forgotpassword}/>
                  </React.Fragment>
                  ) : (
                    <React.Fragment>
                  <Route  path='/Finance/Home' component = {Home}/>
                  </React.Fragment>
                  )}
              </Switch>
            </div>
          </Router>
        </div>
      );
    }
}
function mapStateToProps(state){
  return{
    auth : state.auth
  };
}
export default connect(mapStateToProps)(HomePage);

Как говорили другие, проблема возникает из-за наличия <div> непосредственно внутри элемента <Switch>. Из документация для <Switch>:

All children of a <Switch> should be <Route> or <Redirect> elements.

Таким образом, хотя вы, по-видимому, можете избавиться от этой ошибки, заключив свой элемент в тег фрагмента, он больше соответствует предполагаемому использованию, чтобы вместо этого обернуть его в элемент <Route>.

<Route> без реквизита должен обеспечивать предполагаемое поведение.

Решение простое, просто добавьте еще один слой <React.Fragment> после <Switch>. Надеюсь, поможет.

У меня была эта проблема с react-router-dom, потому что я поместил div в свой Switch. Вместо этого я переместил свой div за пределы моего Switch, и ошибка исчезла.