如何通过document中的方法进行dom元素聚焦

遇到一个聚焦问题，用户想要通过上下键进行对应输入框或者单选框的选择（聚焦），页面显示：

解决措施就是通过css的id选择器进行，当然可以通过class或者ref引用进行，都是可以的。 具体代码就是如下：

事件绑定：38，40的keyCode分别是上和下的按键,通过native原生事件进行prevent

<vxe-radio-group v-model="item.checkValue" v-else @change="({ label }) => {
  onChangeCheckValue('attribute', label, item, row, column);
}
  ">
  <vxe-radio label="Y" content="合格" :id="rowIndex+'idLeft'+index" @keydown.native.up.prevent.native.down.prevent="($event) => onKeydown(row, rowIndex,index,row.checklistValueList,'Left', $event)"></vxe-radio>
  <vxe-radio label="N" content="不合格" :id="rowIndex+'idRight'+index" @keydown.native.up.prevent.native.down.prevent="($event) => onKeydown(row, rowIndex,index,row.checklistValueList,'Right', $event)"></vxe-radio>
</vxe-radio-group>

2.事件具体写法

onKeydown(row,rowIndex,index,checklistValueList,pos,event){
  console.log(event)
    if(event.keyCode===40){//arrow down
        let elementById =document.getElementById(`${rowIndex}id${pos}${index+1}`)
        console.log('3333')
        console.log(elementById)
        if(elementById){
            let inputElement = elementById.querySelector('input');
            if(inputElement){
                inputElement.focus()
            }
        }else{//向下跳格

            let elementById =document.getElementById(`${rowIndex+1}id${pos}0`)
            if(elementById){
                let inputElement = elementById.querySelector('input');
                if(inputElement){
                    inputElement.focus()
                }
            }else {//向下跳格为不同的类型（输入框/单选框）
                if(!!pos){
                    pos=''
                }else{
                    pos='Left'
                }
                let elementById =document.getElementById(`${rowIndex+1}id${pos}0`)
                if(elementById){
                    let inputElement = elementById.querySelector('input');
                    if(inputElement){
                        inputElement.focus()
                    }
                }
            }
        }
    }else if(event.keyCode===38){//arrow up
        let elementById =document.getElementById(`${rowIndex}id${pos}${index-1}`)
        console.log('3333')
        console.log(elementById)
        if(elementById){
            let inputElement = elementById.querySelector('input');
            if(inputElement){
                inputElement.focus()
            }
        }else{//向上跳格
            let elementById =document.getElementById(`${rowIndex-1}id${pos}${this.$refs.grid.getData(rowIndex-1).checklistValueList.length-1}`)
            if(elementById){
                let inputElement = elementById.querySelector('input');
                if(inputElement){
                    inputElement.focus()
                }
            }else{//向上跳格为不同类型（单选框或者输入框）
                if(!!pos){
                    pos=''
                }else{
                    pos='Left'
                }
                let elementById =document.getElementById(`${rowIndex-1}id${pos}${this.$refs.grid.getData(rowIndex-1).checklistValueList.length-1}`)
                if(elementById){
                    let inputElement = elementById.querySelector('input');
                    if(inputElement){
                        inputElement.focus()
                    }
                }
            }
        }
    }
}