Question

它显示此错误：

元素类型无效：预期为字符串（对于内置组件）或类/函数（用于复合组件），但得到：未定义。您可能忘记了从定义文件中导出组件，否则您可能混淆了默认导入和命名导入。检查渲染 import React from 'react'; export default function useGetChatMessages(_id) { const [chatMessages, setChatMessages] = React.useState([]); React.useEffect(() => { const io = require('socket.io-client'); const socket = io('http://localhost:9090'); socket.emit('send-chat-id', _id); socket.on('chat-messages', data => { setChatMessages(data.messages); }); socket.on('new-chat-message', message => { chatMessages.push(message); }); }, [_id, chatMessages]); return chatMessages; }的方法。

App.jsx：

CustomNavbar

component.jsx：

import React from 'react';
import './App.css';
import { BrowserRouter as Router, Route } from 'react-router-dom';
import home from './components/home';
import about from './components/about';
import menu from './components/menu';
import gallery from './components/gallery';
import franchise from './components/franchise';
import Navbar from './components/CustomNavbar';

function App() {
  return (
    <Router>
      <div>
        <Navbar />
        <Route exact path ="/" component={home} />
        <Route  path ="/about" component={about} />
        <Route  path ="/menu" component={menu} />
        <Route  path ="/gallery" component={gallery} />
        <Route  path ="/franchise" component={franchise} /> 
      </div>
    </Router>
  );
}

export default App;

Answer 1

Navbar.Header was removed from react-bootstrap in v1.0.0。要解决您的问题，请降级您的react-bootstrap版本（例如，使用npm install react-bootstrap@0.32.0）或将代码更改为不使用Navbar.Header。

React Bootstrap导航栏：元素类型无效：预期为字符串或类/函数

1 个答案: