Tôi bị kẹt với một vấn đề với phản ứng trơn. Dòng chủ đề có thể không có ý nghĩa, nhưng tôi sẽ cố gắng giải thích chi tiết về kịch bản. Xem ví dụ này fiddle để xem sự cố đang hoạt động.Thanh trượt phản ứng trơn trượt nằm trên cùng một trang nếu các trang trình bày được thay đổi
var DemoSlider = React.createClass({
getSlides(count) {
var slides = [];
for(var i = 0; i < count; i++) {
slides.push((<img key={i} src='http://placekitten.com/g/400/200' />));
}
return slides;
},
render: function() {
var settings = {
dots: false,
infinite: false,
slidesToShow: 3,
slidesToScroll: 3
}
var slides = this.getSlides(this.props.count);
return (
<div className='container'>
<Slider {...settings}>
{ slides }
</Slider>
</div>
);
}
});
Trong bản trình diễn này, ban đầu thanh trượt hiển thị 20 trang trình bày (3 mỗi trang). Ý tưởng là nếu bạn nhấp vào nút, nó sẽ tạo ra một số ngẫu nhiên, đó sẽ là số lượng mới của trang trình bày. Mã này khá đơn giản và tự giải thích.
Để tái tạo sự cố, 1. tiếp tục nhấp vào Mũi tên tiếp theo cho đến khi bạn đến trang trình bày cuối cùng.
2. nhấp vào nút có nội dung 'Nhấp' để tạo số trang trình bày ngẫu nhiên mới.
Kỳ vọng của tôi là trang trình bày sẽ quay trở lại trang trình bày đầu tiên nhưng không được lưu lại trên trang trước đó. Thậm chí tệ hơn, nếu số lượng trang trình bày mới thấp hơn số trước đó, người dùng sẽ thấy một trang trống không có trang trình bày. Khi nhấp vào Lỗi trước, anh/cô ấy có thể truy cập các trang trình bày trước đó và mọi thứ hoạt động bình thường nhưng màn hình ban đầu sẽ hủy hoại trải nghiệm người dùng.
Có điều gì tôi thiếu để thêm vào mã hay đây có phải là lỗi không?
Xin cảm ơn, Abhi.
Cảm ơn người đàn ông. Mặc dù hacky, nhưng điều này làm việc hoàn hảo cho tôi. –