Skip to content

M
mr-julyedu
Commit 3b38178b by zhanghaozhe
Options

周年庆

parent d48ceb19
Showing with 62 additions and 53 deletions
src/components/Index/TopSwiper/index.js
...@@ -6,63 +6,66 @@ import { Link } from "react-router-dom"; ...@@ -6,63 +6,66 @@ import { Link } from "react-router-dom";
class Index extends Component { class Index extends Component {
container = null container = null
swiper = null swiper = null
componentDidMount() { componentDidMount() {
this.swiper = new Swiper('.swiper-container', { if (this.props.bannerList.length > 1) {
direction: 'horizontal', this.swiper = new Swiper('.swiper-container', {
loop: true, direction: 'horizontal',
spaceBetween: 12, loop: true,
centeredSlides: true, spaceBetween: 12,
slidesPerView: 'auto', centeredSlides: true,
loopedSlides: 3, slidesPerView: 'auto',
autoplay: true loopedSlides: 3,
}) autoplay: true,
})
} }
}
componentWillUnmount() { componentWillUnmount() {
this.swiper.destroy() this.swiper.destroy()
} }
render() { render() {
const {bannerList} = this.props const {bannerList} = this.props
return ( return (
<div className={'index-banner-swiper'}> <div className={'index-banner-swiper'}>
<div className={'swiper-container'} ref={el => this.container = el}> <div className={'swiper-container'} ref={el => this.container = el}>
<ul className="swiper-wrapper"> <ul className="swiper-wrapper">
{bannerList && bannerList.length > 0 && bannerList.map((item, index) => { {
return ( bannerList && bannerList.length > 0 && bannerList.map((item, index) => {
<li className={'swiper-slide'} key={index}> return (
{ <li className={'swiper-slide'} key={index}>
Number.isNaN(parseInt(item.jump_url)) ? {
<a href={item.jump_url} key={index}> Number.isNaN(parseInt(item.jump_url)) ?
<img className="item" src={item.name} alt=""/> <a href={item.jump_url} key={index}>
</a> : <img className="item" src={item.name} alt=""/>
<Link </a> :
to={{ <Link
pathname: '/detail', to={{
search: `?id=${item.jump_url}` pathname: '/detail',
}} search: `?id=${item.jump_url}`,
key={index} }}
> key={index}
<img >
className="item" <img
src={item.name} className="item"
alt="" src={item.name}
/> alt=""
</Link> />
} </Link>
</li> }
) </li>
}) )
} })
</ul> }
</div> </ul>
</div> </div>
); </div>
} );
}
} }
export default Index; export default Index;
\ No newline at end of file
src/components/activity/2020-717/activity/index.js
...@@ -1002,7 +1002,7 @@ class Anniversary2020 extends Component { ...@@ -1002,7 +1002,7 @@ class Anniversary2020 extends Component {
</table> </table>
} }
{ {
!!_rankList.length && !isShowAllRankList && <div className="btn"> !!_rankList.length && _rankList.length === 10 && !isShowAllRankList && <div className="btn">
<button onClick={() => { <button onClick={() => {
this.setState({ this.setState({
isShowAllRankList: true, isShowAllRankList: true,
......
src/components/activity/2020-717/question/index.scss
...@@ -123,11 +123,16 @@ ...@@ -123,11 +123,16 @@
ul { ul {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
flex-wrap: wrap;
} }
li { li {
width: 160px; width: 160px;
height: 115px; height: 115px;
&:nth-child(odd){
margin-bottom: 20px;
}
} }
img { img {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment