VUE-ElementUI,DatePicker组件在移动端阻止键盘弹出

由于公司的项目需要运行平板上。但是DateTimePicker的时间输入框在平板上弹出的键盘会挡住时间的选择，最近公司的前端小伙伴一直在头疼这件事。

我就看了一下DateTimePicker组件的源码，结合自己对Vue的浅显认知，添加了下面的代码

// 由于DatePicker本身是可以输入的,将该props置为false,点击时也不会弹出输入框
// 需要在Vue.use前覆盖属性
Element.DatePicker.props.editable = false

Vue.use(Element, {
    size: Cookies.get('size') || 'medium' // set element-ui default size
})


// 需在Vue.use后使用,否则此时的DatePicker对象还没有被Extend,也就不会有_Ctor属性
// 如果是按需引入,则在Vue.use(DatePicker)后使用
// 下面使用到了jquery,如果项目中没有引入jquery,自己通过原生domApi获取即可
Element.DatePicker._Ctor["0"].options.created.push(function () {
    this.$on("focus", () => {
        if (this["init" + this._uid]) {
            return
        }
        this["init" + this._uid] = true
        
        // 由于Vue的渲染默认是在微队列执行的
        // 而setTimeout属于宏队列,且延迟了100ms,所以可以获取到dom元素
        setTimeout(() => {
            const inputs = $(".el-input--small > .el-input__inner[type='text']")
            if (inputs && inputs.length) {
                inputs.each((idx, item) => {
                    if (item.bound) {
                        return
                    }
                    item.bound = true
                    item.addEventListener("focus", (ev) => {
                        ev.target.blur()
                    })
                })
            }
        }, 100)
    })

})

DatePicker.props.editable = false可以使DateTimePicker组件不弹出输入框

而操作DOM节点则是针对DatePicker和TimePicker

如果有哪里不对，请指出，共同进步~~~