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>

 

在Sublime3中安装使用ESLint,CSSLint

参照原文

1、确保本机安装了node.exe 因为ESLint和CSSLint是调用了node的接口方法;

2、sublime安装SublimeLinter插件,然后安装 SublimeLinter-eslint和 SublimeLinter-csslint;

3、在NPM安装ESLint和CSSLint的包,NPM的是全局安装 ;

npm install -g eslint
npm install -g cssslint

 

4、打开sublime的 SublimeLinter配置文件path属性配置eslint的CMD文件路径(npm全局安装后会有)

"paths": {
            "linux": [],
            "osx": [],
            "windows": [
                // 这个是你全局安装eslint后eslint.cmd的所在目录
                "C:/Users/Lin/AppData/Roaming/npm/eslint.cmd"
            ]
        },

 

5、参照原文配置eslint的.eslintrc.json配置文件,或者看官网配置相应的检测rule

configuring

rules

.eslintrc.json文件参考原文的检测规则如下:

.eslintrc.json文件的存放位置可以放在项目的根目录

{
	"env": {
		"browser": true,
		"es6": false,
		"jquery": true,
		"amd": true,
		"node": true
	},
	"parserOptions": {
		"sourceType": "module"
	},
	"rules": {
		"no-cond-assign": [2, "always"], //if, while等条件中不允许使用“=”
		"no-constant-condition": 2,
		"no-debugger": 2, // 程序中不能出现debugger
		"no-dupe-args": 2, // 函数的参数名称不能重复
		"no-dupe-keys": 2, // 对象的属性名称不能重复
		"no-duplicate-case": 2, // switch的case不能重复
		"no-func-assign": 2,
		"no-obj-calls": 2,
		"no-regex-spaces": 2,
		"no-sparse-arrays": 2,
		"no-unexpected-multiline": 2,
		"no-unreachable": 2,
		"use-isnan": 2,
		"valid-typeof": 2,
		"eqeqeq": [2, "always"],
		"no-caller": 2,
		"no-eval": 2,
		"no-redeclare": 2,
		"no-undef": 2,
		"no-unused-vars": 1,
		"no-use-before-define": 2,
		"comma-dangle": [1, "never"],
		"no-const-assign": 2,
		"no-dupe-class-members": 2
	}
}