el-form动态表单验证项

template代码:

<el-form-item 
            label="目标用户及数据需求描述" 
            class="project-desc project-targetUser" 
            prop="targetUser" 
            :rules="targetRequired ? addFormRules.targetUser : addFormRules.targetUserFalse"
          >

通过:rules来控制启用哪个校验规则

script代码:

targetUser: [
          { required: true, message: '请输入目标用户及数据需求描述', trigger: 'blur' }
        ],
        targetUserFalse: [
          { required: false, message: '请输入目标用户及数据需求描述', trigger: 'blur' }
        ],

 

 

el-form清除单项校验属性

如果有选项联动,选择其中一个选项,清除联动项的值并初始化选项的值,会触发form表单的blur事件和校验规则。

kindId: [
      { required: true, message: '请选择设备小类', trigger: 'change' }
],

可以在 $nextTick 用单独清除表单验证项来清理弹出的错误提示:

this.$nextTick(()=>{
        this.$refs.reportForm.clearValidate(['name'])
      })

clearValidate() 参数接收数组

 

JS闭包!function(){}()

叹号后面跟函数!function
和加号后面跟函数+function
都是跟(function(){})();这个函数是一个意思,都是告诉浏览器自动运行这个匿名函数的,因为!+()这些符号的运算符是最高的,所以会先运行它们后面的函数

H5移动端调用浏览器Geolocation方法获取手机gps经纬度方法

具体请看下面代码:

<script>
    var x=document.getElementById("demo");
    function getLocation() {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(showPosition,showError);
        } else {
            x.innerHTML="当前浏览器不支持Geolocation";
        }
    }
    function showPosition(position) {
        x.innerHTML="Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude;
    }
    function showError(error) {
        switch(error.code) {
            case error.PERMISSION_DENIED:
                alert("User denied the request for Geolocation.")
                break;
            case error.POSITION_UNAVAILABLE:
                alert("Location information is unavailable.")
                break;
            case error.TIMEOUT:
                alert("The request to get user location timed out.")
                break;
            case error.UNKNOWN_ERROR:
                alert("An unknown error occurred.")
                break;
        }
    }
    </script>

 

ie8 及以下不支持 array.map 的解决方式

今天做项目的时候,无意乱用map方法,chrome和firefox支持,但是IE8不支持,网上找了一下有木有解,发现国外有大神写了array.prototype的map扩展

JS源码:

success:function(res){
    $('#busicode').find('.select-loading').text('请选择');
        res.data.map(function(element){
        $('#busicode').append('<option value="'+element.busicode+'">'+element.businame+'</option>');
    });
}

array.prototype.map方法:

// Production steps of ECMA-262, Edition 5, 15.4.4.19
// Reference: http://es5.github.com/#x15.4.4.19
if (!Array.prototype.map) {
    Array.prototype.map = function(callback, thisArg) {

        var T, A, k;

        if (this == null) {
            throw new TypeError(" this is null or not defined");
        }

        // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
        var O = Object(this);

        // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
        // 3. Let len be ToUint32(lenValue).
        var len = O.length >>> 0;

        // 4. If IsCallable(callback) is false, throw a TypeError exception.
        // See: http://es5.github.com/#x9.11
        if (typeof callback !== "function") {
            throw new TypeError(callback + " is not a function");
        }

        // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
        if (thisArg) {
            T = thisArg;
        }

        // 6. Let A be a new array created as if by the expression new Array(len) where Array is
        // the standard built-in constructor with that name and len is the value of len.
        A = new Array(len);

        // 7. Let k be 0
        k = 0;

        // 8. Repeat, while k < len
        while(k < len) {

            var kValue, mappedValue;

            // a. Let Pk be ToString(k).
            //   This is implicit for LHS operands of the in operator
            // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
            //   This step can be combined with c
            // c. If kPresent is true, then
            if (k in O) {

                // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
                kValue = O[ k ];

                // ii. Let mappedValue be the result of calling the Call internal method of callback
                // with T as the this value and argument list containing kValue, k, and O.
                mappedValue = callback.call(T, kValue, k, O);

                // iii. Call the DefineOwnProperty internal method of A with arguments
                // Pk, Property Descriptor {Value: mappedValue, : true, Enumerable: true, Configurable: true},
                // and false.

                // In browsers that support Object.defineProperty, use the following:
                // Object.defineProperty(A, Pk, { value: mappedValue, writable: true, enumerable: true, configurable: true });

                // For best browser support, use the following:
                A[ k ] = mappedValue;
            }
            // d. Increase k by 1.
            k++;
        }

        // 9. return A
        return A;
    };
}

参考来源:GO >>