Question

我尝试过与动态孩子发生反应，但它不应该工作，第一次渲染的高度大约是176px但如果我尝试调整浏览器大小然后它工作，高度变为514px。我想可能是我强迫我的组件再渲染一次，但它没有用。我试图复制这个问题，但在那里得到了一些其他问题。

 var Item = React.createClass({
 render: function() {
 return ( < div > < p > kitten pic < /p><br/ > < img src ='http://placekitten.com/g/400/200' / > < /div>)
 }
 });

var ReactSlickDemo = React.createClass({
render: function() {
var settings = {
  dots: false,
  vertical: true,
  autoplay: true,
  autoplaySpeed: 6000,
  arrows: false,
  slidesToShow: 1,
  slidesToScroll: 1,
  touchMove: false,
  swipeToSlide: false,
  swipe: false
}
return ( < div className = 'container' >
  < Slider {...settings
  } >
  < Item / >
  < Item / >
  < Item / >
  < /Slider> < /div>
 );
 }
});

 ReactDOM.render( < ReactSlickDemo / > ,
 document.getElementById('container')
  );

Answer 1

您已在<Item>组件中添加了反应组件<Slider>。因此，您需要将<Item>包裹在<div>内，这应该有效。

 <div>
      < Item / >
      < Item / >
      < Item / >
 </div>

请在以下链接中找到详细信息：

https://github.com/akiran/react-slick/issues/328

React-slick不能在第一次渲染时工作

1 个答案: