成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

react輪播圖組件react-slider-light

leonardofed / 2361人閱讀

摘要：首先說一下，如果大家喜歡可直接收藏我這個項目的地址。因為有可能上版本更新了，但是這邊就不更新了。如果有什么問題，可以隨時問，建議不要或者私信，直接上提，能把問題記錄下來，方便其他人查找。

首先說一下，如果大家喜歡可直接收藏我這個項目的github地址。https://github.com/951565664/... 因為有可能github上版本更新了，但是這邊就不更新了。如果有什么問題，可以隨時問，建議不要QQ或者私信，直接上github提issues，能把問題記錄下來，方便其他人查找。

react-slider-light

a lightweight Slider component built with react.
一個輕量級的 react 輪播組件

Table of Contents

Features特性

Demos演示

Getting Started快速開始

Install

Use

Development

Props

Features

Easy to use 使用簡單: detailed documents and examples 詳細(xì)的文檔和例子

Support custom 支持自定義: Can change style,such as dots and arrows 能夠改變樣式位置，例如 分頁符和箭頭

Demos

Demos and codes 演示和代碼

Getting Started Install

Important: be sure that you have installed react.

重要提醒：請確保先安裝了 react.

# Install
$ npm install react-slider-light
Use 
import React, { Component } from "react";
import Slider from "react-slider-light";

export default class Wrapper extends Component {
    render(){
        return 
            
page1

            
page2

        
    }
}
Development

Want to run demos locally 本地啟動演示

git clone https://github.com/951565664/react-slider-light.git
cd react-slick
npm install
npm start
open http://localhost:8080

more example 更多例子

Props
Props Type Default Value Description Required
defaultSliderIndex number 0 默認(rèn)初始滑動開始位置 No
sliderIndex number 0 控制滑動的頁面 No
delay number 1800 延遲的時間 (ms) No
speed number 500 延遲的時間 (ms) No
sliderToShow number 1 每次展示頁面 No
sliderToScroll number 1 每次滾動的頁面數(shù)量 No
autoPaly bool true 是否自動開始輪播 No
isDots bool false 是否需要dots No
dots enum or func circle dots 的種類，值為circle,gallery,diamond,square,({index,item})=>{ return ReactDom} No
dotStyle object {listStyle: "none",display: "inline-block",margin: "0px 8px",cursor: "pointer",overflow:"hidden"} dots 的樣式
dotX string or number center dot的水平位置 ，可以是right left center這樣的字符串 ,也可以是 30 -20, 表示距離左邊的像素，負(fù)數(shù)表示距右邊的像素 No
dotY string or number middle dot的垂直位置 ，可以是top bottom middle這樣的字符串 ,也可以是 30 -20, 表示距離底部的像素，負(fù)數(shù)表示距頂部的像素 No
isArrows bool false 是否需要箭頭 No
arrowRender func null 箭頭的渲染函數(shù) (type)=>{//type:"backward " ."forward"} No
arrowsY string or number middle arrows的垂直位置 ，可以是top bottom middle這樣的字符串 ,也可以是 30 -20, 表示距離底部的像素，負(fù)數(shù)表示距頂部的像素 No
Filing issues

Please replicate your issue with CodeSandbox template and post it along with issue to make it easy for me to debug.

Change Log 1.0.1

2018-2-15

2.0.3

2018-2-25

測試垂直

3.0.1

2018-2-25

修改bug

3.1.0

2018-6-19

增加滾動到最后一張時，取消動畫，即立刻回到第一張

FAQ Will be updated regularly? 是否會經(jīng)常更新 
Of course, at least 4 hours a week will be taken out for maintenance and development
當(dāng)然會，至少每周會抽出4個小時來維護和開發(fā)
Does it support IE8?是否支持 IE 8

No. 想多了老鐵

Next Add some basic function.增加一些基本功能

Scroll vertically 垂直滾動

gallery 縮略圖

Want more?

The author"s other projects 作者的其他項目

License

MIT

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/107558.html

相關(guān)文章

  • 面試官(6): 寫過『通用前端組件』嗎?

    摘要：很久沒上掘金發(fā)現(xiàn)草稿箱里存了好幾篇沒發(fā)的文章最近梳理下發(fā)出來往期面試官系列如何實現(xiàn)深克隆面試官系列的實現(xiàn)面試官系列前端路由的實現(xiàn)面試官系列基于數(shù)據(jù)劫持的雙向綁定優(yōu)勢所在面試官系列你為什么使用前端框架前言設(shè)計前端組件是最能考驗開發(fā)者基本功的測 很久沒上掘金,發(fā)現(xiàn)草稿箱里存了好幾篇沒發(fā)的文章,最近梳理下發(fā)出來 往期 面試官系列(1): 如何實現(xiàn)深克隆 面試官系列(2): Event Bus...

    waltr 評論0 收藏0

  • React實現(xiàn)輪播圖效果的代碼

    　　　React實現(xiàn)輪播圖效果如下：　　終于可以用上react-slick組件，安裝：　　npminstallreact-slick--save 　　npminstallslick-carousel　　當(dāng)安裝完后，就要導(dǎo)入css文件，主要是為了使用輪播圖的頁面上：　　importSliderfrom'react-slick'; 　　import'slick-carousel...

    3403771864 評論0 收藏0

  • 將輪播圖組件化

    摘要：點擊左箭頭判斷是否到邊緣最后給輪播圖添加自動播放功能，即利用定時器每秒觸發(fā)一次右箭頭的點擊事件。將返回的定時器保存到實例屬性中，以便在鼠標(biāo)懸停的時候停止自動輪播。 ??這是一個輪播圖組件，你可以直接下載使用，這里是代碼地址，需要傳入容器的id和圖片地址，支持Internet Explorer 10+、Firefox、Opera和Chrome等現(xiàn)代瀏覽器。這里是原文地址。 ??之前寫一些...

    MageekChiu 評論0 收藏0

  • 將輪播圖組件化

    摘要：點擊左箭頭判斷是否到邊緣最后給輪播圖添加自動播放功能，即利用定時器每秒觸發(fā)一次右箭頭的點擊事件。將返回的定時器保存到實例屬性中，以便在鼠標(biāo)懸停的時候停止自動輪播。 ??這是一個輪播圖組件，你可以直接下載使用，這里是代碼地址，需要傳入容器的id和圖片地址，支持Internet Explorer 10+、Firefox、Opera和Chrome等現(xiàn)代瀏覽器。這里是原文地址。 ??之前寫一些...

    junbaor 評論0 收藏0

  • 將輪播圖組件化

    摘要：點擊左箭頭判斷是否到邊緣最后給輪播圖添加自動播放功能，即利用定時器每秒觸發(fā)一次右箭頭的點擊事件。將返回的定時器保存到實例屬性中，以便在鼠標(biāo)懸停的時候停止自動輪播。 ??這是一個輪播圖組件，你可以直接下載使用，這里是代碼地址，需要傳入容器的id和圖片地址，支持Internet Explorer 10+、Firefox、Opera和Chrome等現(xiàn)代瀏覽器。這里是原文地址。 ??之前寫一些...

    geekidentity 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<