求高手，在一個輪詢任務里面基數組是變化的，我應該怎么寫才能確定一定輪詢到下個

補充

我再重新描述一下

首先我接收一個數組

['任務A', '任務B', '任務C', '任務D', '任務E']

此時 我輪詢 任務A

然后我接受第二個數組['任務A', '任務B', '任務C', '任務D', '任務E']

此時我輪詢 任務B

然后我接受第三個數組['任務A', '任務B', '任務C', '任務D', '任務E']

此時我輪詢 任務C

但是如果我接受的第三個數組是['任務A', '任務B', '任務C']

我會輪詢任務C

如果接受的第三個數組是[ '任務B', '任務C']

我會輪詢任務C

如果接受的第三個數組是[ '任務D', '任務E']

前面已經輪詢了任務A 和任務B 所以此時輪詢任務 D

如果接受的第三個數組是['任務A', '任務B','任務E']

此時我輪詢 前面已經輪詢了任務A 和任務B 所以此時輪詢任務 E

原來

剛開始有一個數組 ['任務A', '任務B', '任務C', '任務D', '任務E']

我從 任務A 開始輪詢，從A輪詢到E 再從頭輪詢

但是每過30秒后，這個基礎數組可能是變化的，

比如變成了['任務A', '任務B', '任務C']
或者['任務B', '任務C']或者['任務C']

假設剛開始的任務是['任務A', '任務B', '任務C', '任務D', '任務E']

我從 '任務B' 輪詢到 '任務C' 時，數組突然 ['任務A', '任務B']
那么我就想讓 '任務B' 輪詢到 '任務A'

如果數組變成 ['任務D', '任務E'] 我想從 任務D 開始

import React from 'react';

class Basic extends React.Component {

    constructor() {
        super();
        this.state = {
            isShowAll: false, // 這個是控制 要不要 顯示所有任務
            hideOneLiIndex: 0,
            taskTotalNames: [],
            clickLiName: '大屏任務開始'
        }

        this.handleOnMouseEnter = this.handleOnMouseEnter.bind(this);
        this.handleOnMouseLeave = this.handleOnMouseLeave.bind(this);
    }

    handleOnMouseEnter () {
        this.setState({
            isShowAll: true
        })
    }

    handleOnMouseLeave () {
        this.setState({
            isShowAll: false
        })
    }

    renderLi (name, index) {
        return (
            this.state.hideOneLiIndex !== index
                ? <li key={name}
                      className={'on_locking_ul_li'}> {name} </li>
                : null)
    }

    render() {

        const taskTotalNames = this.state.taskTotalNames;
        return (
            <div className={'on_locking_frame'}>
                <div className={'on_locking_list'}
                     onMouseLeave={this.handleOnMouseLeave}
                     onMouseEnter={this.handleOnMouseEnter}>
                    {/* 顯示框 */}
                    <div className={'on_locking_clickLiName'}>
                        {this.state.clickLiName}
                    </div>
                    {/* 下拉列表 */}
                    {taskTotalNames && taskTotalNames.length != 0?
                        this.state.isShowAll ? <ul className={'on_locking_ul'}>
                            {taskTotalNames.map((item, index) => {
                                return this.renderLi(item, index)
                            })} </ul> : null : ''
                    }
                </div>
            </div>
        )
    }

    componentDidMount() {
        const _self = this;
        _self.setState({
            taskTotalNames: ['任務A', '任務B', '任務C', '任務D', '任務E']
        })

        const tableTextMap = new Map([
            [1, ['任務A', '任務C', '任務D', '任務E'] ],
            [2, ['任務A', '任務C', '任務D'] ],
            [3, ['任務A', '任務C', '任務D', '任務D', '任務E']],
            [4, ['任務A']],
            [5, ['任務A', '任務B', '任務C', '任務E']],
            [6, ['任務C', '任務D', '任務D', '任務E']]
        ]);

        let start = 1
        setInterval(function(){
            _self.setState({
                taskTotalNames: tableTextMap.get(start)
            })
            if( start+1 === tableTextMap.length){
                start = 0;
            } else {
                start++;
            }
        }, 30000 )
    }

}


export default Basic;