如何直接或使用异步将 reactstrap carousel 添加为子组件？

Question

我在应用程序中使用了 Reactstrap，但发现 React 存在一些问题。

import CarouselExample from './Sliders/CarouselExample';

   render() {

    return (
        <React.Fragment>
            <div id="container">
                <CarouselExample />
            </div>

      </React.Fragment>
    );
  }
}

line 报告了一个问题，我对此一无所知，因为我是 react-redux 的新手。我应该在我的代码中做什么？

我从这里获取了轮播的示例代码：https://reactstrap.github.io/components/carousel/

使用 16.9.0 构建的应用程序", "react-dom": "^16.9.0", "react-redux": "^7.1.0", "reactstrap": "^8.0.1 ","redux": "^4.0.4" 和 "redux-thunk": "^2.3.0".

容器使用 react 组件，它只是重复一个图像滑块 div。

输出：

我尝试遵循指南并查找示例实现，但无法解决问题。

Answer 1

看起来您缺少 bootstrap 4 依赖项和 CSS。

在您的 index.js 文件中安装 bootstrap 4.3 依赖项和 import "bootstrap/dist/css/bootstrap.min.css"。

更多详情请查看沙盒： https://codesandbox.io/s/tender-newton-vty2r

还要注意在 JSX 中使用 id 标签。重用组件时可能会导致问题。我更喜欢使用 refs。希望这有帮助。

如何直接或使用异步将 reactstrap carousel 添加为子组件？

how to add reactstrap carousel as child component directly or using async?

reactjs

reactstrap