vue ios光标移位

1、获取页面中所有的input元素以及textarea元素：

        var $input1 = document.querySelectorAll("input");

        var $textare1 = document.querySelectorAll("textarea");

2、转化成数组

        var $inputs = Array.from($input1);

        var $textare = Array.from($textare1);

        var inputs =  $inputs.contact($textare);  // 把获取的input数组和textarea数组合并成一个数组进行后面遍历

3、因为只有ios上面光标会一直闪，所以判断一下是不是ios设备

     export const IOS = () => {

            const u = navigator.userAgent;

            const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

            if (isiOS) {

                  return isiOS

            }

        }

4、哪个页面需要修改鼠标移位的问题就在该页面引入IOS

         import {IOS} from '@/对应路径'。

            if (IOS()) {

                if (inputs) {

                    for (var i = 0; i < inputs.length; i++) {

                        if (inputs[i].style.textShadow === '') {

                           inputs.style.textShadow = 'rgba(0,0,0,0) 0 0 0'; // 触发重绘

                        } else {

                           inputs.style.textShadow = '';

                        }

                    }

                }

            }

      }

加上上面的之后，光标就不会移位，就会显示在当前的文本框。

附加判断Android的方法：

export const Android = () => {

    const u = navigator.userAgent;

    const  isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; // android终端

    return isAndroid

}

补充：

1、  contact连接数组方法，连接多个时，后面直接写数组。

  例如：

     const arr =[1,2];

     const brr = [4,5]

     const crr = [6,7]

     console.log( arr.contact(brr,crr))  // [1,2,4,5,6,7]

     也可以用扩展运算符

     var a = [1,2,3];
     var b = [4,5,6];
     var newA = [...a,...b]; console.log(newA); // [1,2,3,4,5,6]

2、Array.from()方法就是将一个类数组对象或者可遍历对象转换成一个真正的数组。

       let arr = {

                '0':'a',

                '1':'b',

                '2':'c',

                length:3

        }

        console.log(Array.form(arr)); // [a,b,c]

        如果参数是一个真正的数组，Array.from会返回一个一模一样的新数组。

        例如： console.log(Array.form([1,2,3])) // [1,2,3]