修复readonly,遵循HTML规范

src/form/checkbox.wc

@@ -198,11 +198,11 @@ export default class Checkbox {
     }
   }
 
-  get readonly() {
+  get readOnly() {
     return this.props.readonly
   }
 
-  set readonly(val) {
+  set readOnly(val) {
     var type = typeof val
 
     if (val === this.props.readonly) {
@@ -240,7 +240,7 @@ export default class Checkbox {
     this._handlClick = $.bind(this, 'click', ev => {
       ev.preventDefault()
 
-      if (!this.disabled && !this.readonly) {
+      if (!this.disabled && !this.readOnly) {
         this.checked = !this.checked
         this.dispatchEvent(new CustomEvent('input'))
       }

src/form/input.wc

@@ -290,16 +290,17 @@ export default class Input {
     this.__LIST__ = this.__OUTER__.children[4]
   }
 
-  get readonly() {
+  get readOnly() {
     return this.props.readonly
   }
 
-  set readonly(val) {
+  set readOnly(val) {
     var type = typeof val
 
     if (val === this.props.readonly) {
       return
     }
+
     if ((type === 'boolean' && val) || type !== 'boolean') {
       this.props.readonly = true
       this.setAttribute('readonly', '')
@@ -417,7 +418,7 @@ export default class Input {
 
     // 键盘事件
     this._handleSubmit = $.catch(this.__INPUT__, 'keydown', ev => {
-      if (this.disabled || this.readonly) {
+      if (this.disabled || this.readOnly) {
         return
       }
       // up: 38, down: 40

src/form/number.wc

@@ -193,11 +193,11 @@ export default class Number {
     this.__INPUT__ = this.__OUTER__.children[1]
   }
 
-  get readonly() {
+  get readOnly() {
     return this.props.readonly
   }
 
-  set readonly(val) {
+  set readOnly(val) {
     var type = typeof val
 
     if (val === this.props.readonly) {
@@ -284,7 +284,7 @@ export default class Number {
   mounted() {
     // 键盘事件
     this._handleSubmit = $.catch(this.__INPUT__, 'keydown', ev => {
-      if (this.disabled || this.readonly) {
+      if (this.disabled || this.readOnly) {
         return
       }
 
@@ -317,7 +317,7 @@ export default class Number {
     })
 
     this._handleAction = $.bind(this.__OUTER__, 'click', ev => {
-      if (this.disabled || this.readonly) {
+      if (this.disabled || this.readOnly) {
         return
       }
       var target = ev.target

src/form/radio.wc

@@ -191,11 +191,11 @@ export default class Radio {
     this.__SWITCH__.classList.toggle('checked', this.props.checked)
   }
 
-  get readonly() {
+  get readOnly() {
     return this.props.readonly
   }
 
-  set readonly(val) {
+  set readOnly(val) {
     var type = typeof val
 
     if (val === this.props.readonly) {
@@ -231,7 +231,7 @@ export default class Radio {
 
   mounted() {
     this._handleClick = $.bind(this, 'click', ev => {
-      if (!this.disabled && !this.readonly && !this.checked) {
+      if (!this.disabled && !this.readOnly && !this.checked) {
         this.checked = true
         this.dispatchEvent(new CustomEvent('input'))
       }

src/form/select.wc

@@ -167,6 +167,10 @@
   cursor: not-allowed;
   opacity: 0.6;
 }
+:host([readonly]) .label {
+  opacity: 0.8;
+}
+
 :host(:focus-within) {
   @include focus1;
 }
@@ -178,6 +182,10 @@
 :host([round]) {
   border-radius: 21px;
 
+  .label input {
+    padding: 0 10px;
+  }
+
   .prepend {
     border-radius: 21px 0 0 21px;
   }
@@ -261,6 +269,7 @@ export default class Select {
     value: '',
     options: '',
     mvidx: null, //下拉列表光标的索引ID
+    readonly: false,
     disabled: false
   }
 
@@ -274,6 +283,25 @@ export default class Select {
     this.__OPTG__ = this.__OUTER__.children[4]
   }
 
+  get readOnly() {
+    return this.props.readonly
+  }
+
+  set readOnly(val) {
+    var type = typeof val
+
+    if (val === this.props.readonly) {
+      return
+    }
+    if ((type === 'boolean' && val) || type !== 'boolean') {
+      this.props.readonly = true
+      this.setAttribute('readonly', '')
+    } else {
+      this.props.readonly = false
+      this.removeAttribute('readonly')
+    }
+  }
+
   get disabled() {
     return this.props.disabled
   }
@@ -424,7 +452,7 @@ export default class Select {
 
     // 键盘事件
     this._handleKeydown = $.catch(this.__INPUT__, 'keydown', ev => {
-      if (this.disabled || this.readonly) {
+      if (this.disabled || this.readOnly) {
         return
       }
       // up: 38, down: 40
@@ -448,6 +476,10 @@ export default class Select {
     this._activeFn = $.bind(this.__INPUT__, 'click', ev => {
       var { options } = this.props
 
+      if (this.disabled || this.readOnly) {
+        return
+      }
+
       initPos.call(this)
       this.__OPTG__.classList.toggle('show')
     })