fix: use watch instead of onChange for checkboxes

src/common/ui/setting-check.vue

@@ -1,5 +1,5 @@
 <template>
-  <input type="checkbox" v-model="value" @change="onChange" :disabled="disabled">
+  <input type="checkbox" v-model="value" :disabled="disabled">
 </template>
 
 <script>
@@ -20,6 +20,20 @@ export default {
       value: null,
     };
   },
+  watch: {
+    value(value) {
+      // Maxthon is recognized as Chrome in Vue.js.
+      // Due to vuejs/vue#4521, model is updated actually on click.
+      // Normally `click` event should be fired before `change` event.
+      // But Maxthon 4.4 sucks, `change` event is fired first, which breaks everything!
+      // And this is fixed in later versions, so we watch the value instead of
+      // listening to `change` event to keep the code consistent.
+      if (this.sync) {
+        options.set(this.name, value);
+      }
+      this.$emit('change', value);
+    },
+  },
   created() {
     this.value = options.get(this.name);
     this.revoke = hookSetting(this.name, value => {
@@ -29,13 +43,5 @@ export default {
   beforeDestroy() {
     this.revoke();
   },
-  methods: {
-    onChange() {
-      if (this.sync) {
-        options.set(this.name, this.value);
-      }
-      this.$emit('change', this.value);
-    },
-  },
 };
 </script>