react寫一個簡單的slide效果求助

我寫這個輪播的思路是通過改變left值來達(dá)到滾動的效果，
但現(xiàn)在遇到一個問題，該怎么去判斷輪播已經(jīng)滑倒底了？
（我的想法是通過index來計數(shù)，但是發(fā)現(xiàn)index會總是和點擊的次數(shù)值不一致？慢兩拍）
輪播的結(jié)構(gòu)大該是這樣的：

constructor(props) {
        super(props);
        this.state = {
           
            leftV: 0,
            index: 0
        }
    }
    right() {
        const left = document.getElementById("slideContainer").offsetLeft;
        
        this.setState((prevState) => ({
            leftV: left - 270,
            index: prevState.index+1
        }));
       
    }
    left() {
        const right = document.getElementById("slideContainer").offsetLeft;
        
        this.setState((prevState) => ({
            leftV: right + 270,
            index: prevState.index-1
        }));
        
    }

<div className="slideWrap">
    <div className="leftArrow" onClick={this.left}></div>
    <div className="rightArrow" onClick={this.right}></div>
    <ul style={{left:this.state.leftV}}>
        {
           this.state.arr.map((item,index) => {
                return (
                    <li>//內(nèi)容</li>
                );
           })
        }
    </ul>
</div>