处理无效的数据

source/package.json

@@ -9,20 +9,21 @@
     "build-watch": "vue-cli-service build --watch"
   },
   "dependencies": {
-    "@types/fs-extra": "^9.0.9",
-    "@types/node": "^14.14.37",
+    "@types/kind-of": "^6.0.0",
     "babel-eslint": "^10.1.0",
     "core-js": "^3.6.5",
-    "uuid": "^8.3.2",
     "element-ui": "^2.15.1",
     "fs-extra": "^9.1.0",
     "less": "^4.1.1",
     "less-loader": "^7.3.0",
+    "uuid": "^8.3.2",
     "vue": "^2.6.11",
     "vue-class-component": "^7.2.3",
     "vue-property-decorator": "^9.1.2"
   },
   "devDependencies": {
+    "@types/fs-extra": "^9.0.9",
+    "@types/node": "^14.14.37",
     "@types/uuid": "^8.3.1",
     "@types/chrome": "0.0.133",
     "@typescript-eslint/eslint-plugin": "^4.18.0",

source/src/devtools/data.ts

@@ -79,7 +79,7 @@ export class ObjectData extends Info {
 }
 
 export class InvalidData extends Info {
-  data: any;
+  data: "undefined" | "null" | "Infinity" | "NaN"|string;
 
   constructor(data: any) {
     super();

source/src/devtools/ui/index.vue

@@ -98,7 +98,7 @@ export default class Index extends Vue {
       this._expand(data.engineUUID);
     })
     Bus.$on(BusMsg.RequestObjectData, (data: ObjectData, cb: Function) => {
-      if (this.requestList.find(el => el.id === data.id)) {
+      if (!data.id || this.requestList.find(el => el.id === data.id)) {
         return
       }
       this.requestList.push({id: data.id, cb});

source/src/devtools/ui/ui-prop.vue

@@ -20,7 +20,7 @@
       </div>
       <div class="value">
         <div v-if="isInvalid()" class="invalid">
-          {{ getInvalidDisplayText() }}
+          {{ value.data }}
         </div>
         <el-input v-if="isString()" v-model="value.data"
                   :disabled="value.readonly"
@@ -162,26 +162,6 @@ export default class UiProp extends Vue {
     return this.value && (this.value.type === DataType.Invalid);
   }
 
-  getInvalidDisplayText() {
-    if (this.isInvalid()) {
-      const data = this.value.data;
-      switch (data) {
-        case undefined: {
-          return "undefined"
-        }
-        case null: {
-          return "null"
-        }
-        case Infinity: {
-          return "Infinity"
-        }
-        default: {
-          return `未知的无效数据：${data}`
-        }
-      }
-    }
-  }
-
   isString() {
     return this.value && (this.value.type === DataType.String);
   }
@@ -244,10 +224,14 @@ export default class UiProp extends Vue {
 
   mounted() {
     this.watchValue();
+    if(this.isInvalid()){
+      this.value.data;
+      debugger
+    }
   }
 
   isShowTooltip() {
-    const el: HTMLDivElement = this.$refs.propText;
+    const el: HTMLDivElement = this.$refs.propText as HTMLDivElement;
     if (el) {
       if (el.scrollWidth > el.offsetWidth) {
         // 出现了省略号

source/src/inject/index.ts

@@ -271,6 +271,10 @@ class CCInspector {
   _genInfoData(node: any, key: string | number, path: Array<string>, filterKey = true) {
     let propertyValue = node[key];
     let info = null;
+    let invalidType = this._isInvalidValue(propertyValue);
+    if (invalidType) {
+      info = new InvalidData(invalidType);
+    } else {
       switch (typeof propertyValue) {
         case "boolean":
           info = new BoolData(propertyValue);
@@ -282,10 +286,8 @@ class CCInspector {
           info = new StringData(propertyValue);
           break;
         default:
-        if (this._isInvalidValue(propertyValue)) {
-          info = new InvalidData(propertyValue);
           //@ts-ignore
-        } else if (propertyValue instanceof cc.Color) {
+          if (propertyValue instanceof cc.Color) {
             let hex = propertyValue.toHEX();
             info = new ColorData(`#${hex}`);
           } else if (Array.isArray(propertyValue)) {
@@ -344,6 +346,7 @@ class CCInspector {
           }
           break;
       }
+    }
     if (info) {
       info.readonly = this._isReadonly(node, key)
       info.path = path;
@@ -389,7 +392,23 @@ class CCInspector {
   }
 
   _isInvalidValue(value: any) {
-    return value === null || value === Infinity || value === undefined;
+    // !!Infinity=true
+    if ((value && value !== Infinity) || value === 0 || value === false) {
+      return false;
+    }
+
+    if (value === null) {
+      return "null"
+    } else if (value === Infinity) {
+      return "Infinity"
+    } else if (value === undefined) {
+      return "undefined"
+    } else if (Number.isNaN(value)) {
+      return "NaN";
+    } else {
+      debugger
+      return false;
+    }
   }
 
   _buildObjectData({value, path, data, filterKey}: BuildObjectOptions) {