第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何檢測(cè)用戶是否點(diǎn)擊了react-multi-carousel中的箭頭?

如何檢測(cè)用戶是否點(diǎn)擊了react-multi-carousel中的箭頭?

江戶川亂折騰 2023-10-20 10:22:08
如何檢測(cè)用戶是否單擊了上一個(gè)/下一個(gè)箭頭來(lái)切換react-multi-carousel中自動(dòng)播放的值? return (    <Carousel      autoPlay={true}      autoPlaySpeed={4500}      customTransition="all .5"      transitionDuration={300}      infinite={true}        >      {movies.map((movie) => (        <img          key={movie.id}          style={{ width: "100%", height: "100%" }}          src={movie.image}          alt={movie.title}        />      ))}    </Carousel>
查看完整描述

2 回答

?
心有法竹

TA貢獻(xiàn)1866條經(jīng)驗(yàn) 獲得超5個(gè)贊

如果您對(duì)頁(yè)面切換時(shí)調(diào)用的任何內(nèi)容感到好奇,

當(dāng)您看到“react-multi-carousel”的文檔時(shí),頁(yè)面轉(zhuǎn)換時(shí)會(huì)調(diào)用一個(gè)回調(diào)函數(shù)。

這里

<Carousel

  afterChange={(previousSlide, { currentSlide, onMove }) => {

    doSpeicalThing();

  }}

  beforeChange={(nextSlide, { currentSlide, onMove }) => {

    doSpeicalThing();

  }}

/>


查看完整回答
反對(duì) 回復(fù) 2023-10-20
?
HUWWW

TA貢獻(xiàn)1874條經(jīng)驗(yàn) 獲得超12個(gè)贊

您可以使用每次滑動(dòng)之前和之后調(diào)用的beforeChange和回調(diào)。afterChange

如果您只想檢測(cè)按鈕單擊(而不是鍵盤滑動(dòng)或拖動(dòng)),則可以創(chuàng)建新的按鈕組件并將它們作為自定義箭頭傳遞。您的自定義按鈕將收到道具/狀態(tài)列表;其中之一是 的處理react-multi-carousel程序onClick。

您可以將自定義按鈕作為道具 (customLeftArrowcustomRightArrow) 傳遞到輪播。

function CustomRightArrow({ onClick }) {

? function handleClick() {

? ? // do whatever you want on the right button click

? ? console.log('Right button clicked, go to next slide');

? ? // ... and don't forget to call onClick to slide

? ? onClick();

? }


? return (

? ? <button

? ? ? onClick={handleClick}

? ? ? aria-label="Go to next slide"

? ? ? className="react-multiple-carousel__arrow react-multiple-carousel__arrow--right"

? ? />

? );

}


function App() {

? return (

? ? <Carousel

? ? ? customLeftArrow={<CustomLeftArrow />}

? ? ? customRightArrow={<CustomRightArrow />}

? ? ? infinite

? ? ? keyBoardControl

? ? >

? ? ? {images.map((image, i) => {

? ? ? ? return (

? ? ? ? ? <img

? ? ? ? ? ? key={i}

? ? ? ? ? ? style={{ width: '100%', height: '100%' }}

? ? ? ? ? ? src={image}

? ? ? ? ? ? alt=""

? ? ? ? ? />

? ? ? ? );

? ? ? })}

? ? </Carousel>

? );

}


查看完整回答
反對(duì) 回復(fù) 2023-10-20
  • 2 回答
  • 0 關(guān)注
  • 156 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)