亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

React-bootstrap - 無效的掛鉤調用 - ButtonDropdown

React-bootstrap - 無效的掛鉤調用 - ButtonDropdown

墨色風雨 2022-10-21 10:12:09
我是 React 和 JS 的新手,正在嘗試為我的 CRUD SpringBoot 應用程序實現一個 React 前端。我正在嘗試將 ButtonDropdown 添加到我的一個頁面。這是代碼:通用buttondrop.jsimport React, { Component, useState } from 'react';import { ButtonDropdown, DropdownMenu, DropdownItem, DropdownToggle } from 'reactstrap';import Dropdown from 'react-bootstrap/Dropdown';import DropdownButton from 'react-bootstrap/DropdownButton';const Bdrop = (props) => {  const [dropdownOpen, setOpen] = useState(false);  const toggle = () => setOpen(!dropdownOpen);  return (    <ButtonDropdown isOpen={dropdownOpen} toggle={toggle}>      <DropdownToggle caret>        Button Dropdown      </DropdownToggle>      <DropdownMenu>            <Dropdown.Item href="#/action-1">Action</Dropdown.Item>            <Dropdown.Item href="#/action-2">Another action</Dropdown.Item>            <Dropdown.Item href="#/action-3">Something else</Dropdown.Item>      </DropdownMenu>    </ButtonDropdown>  );}應用程序.jsimport React, { Component } from 'react';import './App.css';import Home from './Home';import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';import CustomerList from './CustomerList';import EmployeeList from './EmployeeList';import CustomerEdit from './CustomerEdit';import EmployeeEdit from './EmployeeEdit';import SessionList from './SessionList';import Bdrop from './buttondrop';class App extends Component {  render() {    return (      <Router>        <Switch>          <Route path='/' exact={true} component={Home}/>          <Route path='/customers' exact={true} component={CustomerList}/>          <Route path='/customer/:id' component={CustomerEdit}/>          <Route path='/employees' exact={true} component={EmployeeList}/>          <Route path='/employee/:id' component={EmployeeEdit}/>          <Route path='/sessions' exact={true} component={SessionList}/>          <Route path='/buttondrop' component={() => <Bdrop /> }/>        </Switch>      </Router>    )  }}
查看完整描述

1 回答

?
qq_遁去的一_1

TA貢獻1725條經驗 獲得超8個贊

這是一個帶有工作組件的版本的沙盒鏈接。<Bdrop />

在不知道您正在使用的 Bootstrap、react-bootstrap 和 reactstrap 的版本的情況下,很難說這是否是導致您出現問題的原因。


查看完整回答
反對 回復 2022-10-21
  • 1 回答
  • 0 關注
  • 135 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號