Получение Uncaught TypeError: Object (...) не является функцией в ThemeProvider.js Bootstrap - PullRequest
0 голосов
/ 04 ноября 2019

Ran "> npm install response-bootstrap bootstrap"

Импортировал компонент кнопки из Bootstrap и добавил на страницу. Я получаю сообщение об ошибке ниже.

В моем файле package.json есть записи для начальной загрузки вместе с другими записями для реакции.

"react-bootstrap": "^1.0.0-beta.14",
"bootstrap": "^4.3.1",

import React, { Component } from 'react';
import ToggleButtonGroup from 'react-bootstrap/ToggleButtonGroup';
import ToggleButton from 'react-bootstrap/ToggleButton';

class MyButtonComponent extends Component {

    render() {
        let value  =1;
        return (

           <ToggleButtonGroup type="checkbox" value={value} >
             <ToggleButton value={1}>Option 1</ToggleButton>
             <ToggleButton value={2}>Option 2</ToggleButton>
             <ToggleButton value={3}>Option 3</ToggleButton>
           </ToggleButtonGroup>

        );
    }
}

export default MyButtonComponent ;

Журнал ошибок

ThemeProvider.js:29 Uncaught TypeError: Object(...) is not a function
    at useBootstrapPrefix (VM106126 ThemeProvider.js:29)
    at eval (VM106134 ButtonGroup.js:29)
    at updateForwardRef (VM105779 react-dom.development.js:13046)
    at beginWork (VM105779 react-dom.development.js:13837)
    at performUnitOfWork (VM105779 react-dom.development.js:15864)
    at workLoop (VM105779 react-dom.development.js:15903)
    at HTMLUnknownElement.callCallback (VM105779 react-dom.development.js:100)
    at Object.invokeGuardedCallbackDev (VM105779 react-dom.development.js:138)
    at invokeGuardedCallback (VM105779 react-dom.development.js:187)
    at replayUnitOfWork (VM105779 react-dom.development.js:15311)

Ответы [ 2 ]

0 голосов
/ 04 ноября 2019

React bootstrap v1.0.0-beta.14 имеет peerDependency по реагированию и реагированию dom и требует версий >=16.8.0, которые поддерживают перехватчики, поэтому вы получаете эту ошибку

  "peerDependencies": {
    "react": ">=16.8.0",
    "react-dom": ">=16.8.0"
  },

Обновите ваши версии реагирования и реагирования с 16.4.0 до 16.8.0 или более поздней версии для устранения вышеуказанной ошибки

0 голосов
/ 04 ноября 2019

Я не вижу ничего плохого в вашем коде, поэтому я попробовал это сделать в песочнице кода и получаю вывод правильно, ошибка могла быть вызвана каким-то другим компонентом:

import ToggleButtonGroup from "react-bootstrap/ToggleButtonGroup";
import ToggleButton from "react-bootstrap/ToggleButton";

class MyButtonComponent extends Component {
  render() {
    let value = 1;
    return (
      <ToggleButtonGroup type="checkbox" value={value}>
        <ToggleButton value={1}>Option 1</ToggleButton>
        <ToggleButton value={2}>Option 2</ToggleButton>
        <ToggleButton value={3}>Option 3</ToggleButton>
      </ToggleButtonGroup>
    );
  }
}

export default MyButtonComponent;

Вотчто такое вывод:

enter image description here

Вот ссылка на CodeSandBox Пример: https://codesandbox.io/s/boring-leaf-xj8ix

...