Question

在jquery中，使用event.currentTarget来获取下一张幻灯片的元素，以查看是否存在一个属性并替换为另一个，最后，当滑块的所有属性（数据背景）都移除事件侦听器时已被替换。

$(this).on('slide.bs.carousel', function (event) {
    var nextSlider = event.relatedTarget;
    if(typeof $(nextSlider).attr('data-background') != 'undefined'){
        $(nextSlider).attr("style",'cursor:pointer; '+'background:'+$(nextSlider).attr('data-background')+" no-repeat center center");
        $(nextSlider).removeAttr('data-background');
    }
    if($(this).find('.item[data-background]').length==0){
        $(this).off('slide.bs.carousel');
    }
});

现在使用react bootstrap轮播，并希望在轮播滑动时获取轮播的下一个元素（如上例所示），其中触发事件的名称为onSelect，但不知道是什么与事件等效的方法的名称。currentTarget??

  handleSelect(selectedIndex, event) {
    console.log('carousel new slide....');

    var nextSlider = event.currentTarget;
    if(typeof nextSlider.attributes.getNamedItem('data-src') != 'undefined'){
      console.log('haves data-src');
    }else{
      console.log('doesn\'t haves data-src');
    }
}

Answer 1

已更改为在handleSelect(selectedIndex, event)中使用selectedIndex来更新Component状态并使用轮播的下一张幻灯片的Items src属性重新呈现。

React Bootstrap轮播onSelect事件

1 个答案: