Bear Slide Card

當你想使用圖片在背景中，或者放置卡片，自訂內容時使用

import BearCarousel, {BearSlideCard} from 'bear-react-carousel';

const numberColors = [
    {id: 1, color: 'green'},
    {id: 2, color: 'blue'},
    {id: 3, color: 'gray'},
];
const data = numberColors.map(row => {
    return <BearSlideCard key={row.id}>
        <div style={{height: '100%', backgroundColor: row.color}}/>
    </BearSlideCard>;
});

<BearCarousel
    // ...ignore some 
    height="250px"
    data={data}
/>

Props

參數名稱	類型	預設值	說明
style	CSS.Properties
className	string
bgUrl	string		卡片背景的圖片路徑
bgSize	string	cover	卡片背景的顯示大小
children	JSX.Element		卡片內容
onClick	() => void		卡片點擊事件

Tip

如果你需要輪播項目 onClick，請直接使用這個參數，而不是自訂在內部中使用

但如果你真的需要內部中使用 onClick，可能需要自己處理冒泡事件來避免滑動時觸發 onClick

Bear Slide Card

Props​

Props