mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-08-01 21:37:06 +08:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

refactor: carousel ref strings to callback (#7486)

Browse Source
This commit is contained in:
Wei Zhu 2017-09-07 20:41:14 -05:00 committed by Benjy Cui
parent 825a3d5e95
commit 32b7a3f752
2 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/carousel/__tests__/index.test.js
View File

@ -6,7 +6,7 @@ describe('Carousel', () => {
it('should has innerSlider', () => { it('should has innerSlider', () => {
const wrapper = mount(<Carousel><div /></Carousel>); const wrapper = mount(<Carousel><div /></Carousel>);
const innerSlider = wrapper.node.innerSlider; const innerSlider = wrapper.node.innerSlider;
const innerSliderFromRefs = wrapper.node.refs.slick.innerSlider; const innerSliderFromRefs = wrapper.node.slick.innerSlider;
expect(innerSlider).toBe(innerSliderFromRefs); expect(innerSlider).toBe(innerSliderFromRefs);
expect(typeof innerSlider.slickNext).toBe('function'); expect(typeof innerSlider.slickNext).toBe('function');
}); });

18
components/carousel/index.tsx
View File

@ -74,9 +74,7 @@ export default class Carousel extends React.Component<CarouselProps, any> {
draggable: false, draggable: false,
}; };
refs: { slick: any;
slick: any,
};
innerSlider: any; innerSlider: any;
@ -92,9 +90,8 @@ export default class Carousel extends React.Component<CarouselProps, any> {
if (autoplay) { if (autoplay) {
window.addEventListener('resize', this.onWindowResized); window.addEventListener('resize', this.onWindowResized);
} }
const { slick } = this.refs;
// https://github.com/ant-design/ant-design/issues/7191 // https://github.com/ant-design/ant-design/issues/7191
this.innerSlider = slick && slick.innerSlider; this.innerSlider = this.slick && this.slick.innerSlider;
} }
componentWillUnmount() { componentWillUnmount() {
@ -107,13 +104,16 @@ export default class Carousel extends React.Component<CarouselProps, any> {
onWindowResized = () => { onWindowResized = () => {
// Fix https://github.com/ant-design/ant-design/issues/2550 // Fix https://github.com/ant-design/ant-design/issues/2550
const { slick } = this.refs;
const { autoplay } = this.props; const { autoplay } = this.props;
if (autoplay && slick && slick.innerSlider && slick.innerSlider.autoPlay) { if (autoplay && this.slick && this.slick.innerSlider && this.slick.innerSlider.autoPlay) {
slick.innerSlider.autoPlay(); this.slick.innerSlider.autoPlay();
} }
} }
saveSlick = (node) => {
this.slick = node;
}
render() { render() {
let props = { let props = {
...this.props, ...this.props,
@ -130,7 +130,7 @@ export default class Carousel extends React.Component<CarouselProps, any> {
return ( return (
<div className={className}> <div className={className}>
<SlickCarousel ref="slick" {...props} /> <SlickCarousel ref={this.saveSlick} {...props} />
</div> </div>
); );
} }