在react項目中使用回車鍵（Enter）實現tab切換輸入框的功能（以及Don't make functions within a loop no-loop-func的問題）

　　在這碰到的一個問題就是代碼在正常的HTML文件中是沒有什麼問題的，可是當代碼放到react項目中就會報警告Don't make functions within a loop  no-loop-func（其實大體的意思就是說不要在循環中生成或嵌套函數），多是嚴格模式的緣由。實現方式只須要須要添加這個效果的輸入框加上一個class名‘input‘，這邊使用過獲取全部須要這個功能的輸入框進行循環而後分別給它們加上鍵盤事件，經過keyCode值等於13判斷爲回車鍵。

export function changeEnter() {
    var inputs = document.getElementsByClassName('input');
    // console.log(inputs)
    var item = null;
    for(var i = 0; i < inputs.length; i++){
        item = inputs[i];
        (function() {
            var next = (i+1) < inputs.length ? i+1 : 0 ; //判斷是否爲最後一個輸入框，是返回第一個，否返回下一個
            item.onkeydown = function(event){
                var eve = event ? event : window.event;
                // console.log(eve)
                if(eve.keyCode === 13){
                    // console.log(inputs[next])
                    if (inputs[next].tagName === 'INPUT') {
                        inputs[next].focus();    //獲取焦點
                    } else {
                        console.log(22)
                    }
                }
            }
        })()
    }    
}

　　解決的方法以下：

export function changeEnter() {
    var inputs = document.getElementsByClassName('input');
    function init() {
        for(let i = 0; i < inputs.length; i++){
            inputs[i].onkeydown = focus(i)
        }     
    }
    // console.log(inputs)
    var focus = function handle(i) {
        return function(event) {
            var next = (i + 1) < inputs.length ? i + 1 : 0;  // 判斷是否爲最後一個輸入框，是則返回第一個，不然繼續下一個
            var eve = event ? event : window.event;
            if (eve.keyCode === 13) {
                if (inputs[next].tagName === 'INPUT') {
                    inputs[next].focus();    //獲取焦點
                } else {
                    console.log(22)
                }
            }
        }
    }
    init()
}

　　這樣的話警告就不會出現了，可是這邊存在的問題就是在react+Ant Design中只適用於Input組件，像Ant Design中的Select以及日期選框都很差使，可是在原生input以及select下拉框是沒有問題的。如今還沒解決給Ant design中的下拉框以及時間控件加這個功能，後續解決了再次更新。