style:表单验证

@@ -16,7 +16,8 @@ export default {
         sqrxm: '',
         sqrzjlxbm: '',
         sqrzjhm: '',
-        lxdh: ''
+        lxdh: '',
+        inputErr: false
       }]
     }
   },
@@ -91,9 +92,16 @@ export default {
             label: '联系电话',
             render: (h, scope) => {
               return (
-                <el-input placeholder="联系电话" value={scope.row[scope.column.property]}
-                  onInput={(val) => { scope.row[scope.column.property] = val }} type='tel' maxlength='11'
-                ></el-input>
+                <div class='typePhone'>
+                  <el-input placeholder="联系电话" value={scope.row[scope.column.property]}
+                    onInput={(val) => { scope.row[scope.column.property] = val }}
+                    onBlur={(val) => { this.teltest(scope.row) }}
+                    type='tel' maxlength='11'
+                  ></el-input>
+                  <span v-show={scope.row.inputErr} style={{
+                    fontSize: '12px', color: 'red', position: 'absolute', bottom: '-2px', left: '0'
+                  }}>请输入正确手机号</span>
+                </div>
               )
             }
           }
@@ -115,6 +123,7 @@ export default {
     dataList: {
       handler (newValue, oldName) {
         this.tableData.data = _.cloneDeep(newValue)
+        console.log(this.tableData.data, 'this.tableData.datathis.tableData.data');
       },
       deep: true,
       immediate: true
@@ -126,15 +135,29 @@ export default {
         sqrxm: '',
         sqrzjlxbm: '',
         sqrzjhm: '',
-        lxdh: ''
+        lxdh: '',
+        inputErr: false
       })
     },
     handleMinus (index, row) {
       this.tableData.data.splice(index, 1)
     },
-  },
+    teltest (row) {
+      const reg = /^1([38]\d|5[0-35-9]|7[3678])\d{8}$/;
+      if (row.lxdh == '' || row.lxdh.length <= 10 || !reg.test(row.lxdh)) {
+        row.inputErr = true
+        return false
+
+      } else {
+        row.inputErr = false
+        return true
+      }
+    }
+  }
 }
 </script>
 <style scoped lang='scss'>
-
+/deep/.el-table__cell {
+  padding: 12px 0;
+}
 </style>
\ No newline at end of file

@@ -65,7 +65,8 @@ export default {
         sqrxm: '',
         sqrzjlxbm: '',
         sqrzjhm: '',
-        lxdh: ''
+        lxdh: '',
+        inputErr: false
       }],
       sqdataList: [],
       qldataList: [],