我正在编写一个基于react.js的网站。我希望在我的索引页面中自动滑动背景图像,并从Ant Design导入元素{carousel},该元素具有如何使用carousel
的实现。我有代码将路由到每个组件。现在,我想知道如何将{carousel}插入索引页面。我有以下代码:如何将<carousel>元素插入react.js
/* eslint no-unused-vars: "off" */
import React from 'react';
import { render } from 'react-dom';
import { Router, Route, browserHistory } from 'react-router'
import Root from './Root/Root'
import MainLayout from './MainLayout/MainLayout'
import MyRoot from './MyRoot/MyRoot'
import CreateNew from './CreateNew/CreateNew'
import './index.css'
import { Carousel } from 'antd';
// see https://github.com/ReactTraining/react-router
render((
// <Carousel autoplay>
// <div><image>1</image></div>
// <div><image>2</image></div>
// <div><image>3</image></div>
// <div><image>4</image></div>
// </Carousel>, mountNode;
<Router history={browserHistory}>
<Route component={MainLayout}>
<Route path="/" component={Root}/>
<Route path="/myitinerary" component={MyRoot}/>
<Route path="/createnew" component={CreateNew}/>
</Route>
</Router>
), document.getElementById('root'));
老实说,我不知道为什么我这样做,我只是猜测。或者我需要创建另一个组件来保存轮换信息?或者有没有其他简单易懂的方法来做到这一点。非常感谢!
我假设你会把它放到MainLayout组件中,就像你有它的方式(当然没有注释过) –
@SamiKuhmonen谢谢你的建议,但它不管用。 –
@XiufenXu你看到我的回答了吗?它帮助你吗? – Sergio