我正在編寫一個基於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