在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中的下拉框以及時間控件加這個功能，后續解決了再次更新。