From f0ce8278c96fb2907c9413e15dec982a20d10b29 Mon Sep 17 00:00:00 2001
From: STAFYNIAK Sacha <sacha.st@live.fr>
Date: Mon, 17 Sep 2018 05:53:02 +0200
Subject: [PATCH] add support for 'function' values in json objects

---
 README.md               | 11 ++++++-----
 examples/app.js         |  3 ++-
 json-box.vue            |  3 +++
 types/json-function.vue | 18 ++++++++++++++++++
 4 files changed, 29 insertions(+), 6 deletions(-)
 create mode 100644 types/json-function.vue

diff --git a/README.md b/README.md
index 4657c7a..5a5b5d6 100644
--- a/README.md
+++ b/README.md
@@ -4,19 +4,19 @@ Simple json display component,  based on vue
 
 ## Installing:
 Using npm:
-``` 
+```
 $ npm install vue-json-viewer
 ```
 Using bower:
 
 
-``` 
+```
 $ yarn add vue-json-viewer
 ```
 
 ## Example:
 
-``` html 
+``` html
 <json-viewer :value="jsonData" :show-copy="true" icon-prefix="ion" :show-bigger="true"></json-viewer>
 ```
 
@@ -31,6 +31,7 @@ export default {
           {key: 'hello word'},
         ],
         val: {
+          c: () = {},
           b: 'a',
           a: 'hello word',
           asd2: 1,
@@ -42,12 +43,12 @@ export default {
 }
 ```
 ## Result:
-![ABC](http://oxqqtdux0.bkt.clouddn.com/WX20180702-172158.png) 
+![ABC](http://oxqqtdux0.bkt.clouddn.com/WX20180702-172158.png)
 
 
 ## Options:
 
-| Property         | Description           | 
+| Property         | Description           |
 | ----------- |:-------------|
 | value       | json data |
 | show-copy   | display the copy button |
diff --git a/examples/app.js b/examples/app.js
index cf90e20..5b5e1de 100644
--- a/examples/app.js
+++ b/examples/app.js
@@ -12,6 +12,7 @@ new Vue({
                   {key: 'hello word'},
                 ],
                 val: {
+                  c: () = {},
                   b: 'a',
                   a: 'hello word',
                   asd2: 1,
@@ -21,4 +22,4 @@ new Vue({
         }
     },
     components: {JsonViewer}
-})
\ No newline at end of file
+})
diff --git a/json-box.vue b/json-box.vue
index 9857f48..b79ae86 100644
--- a/json-box.vue
+++ b/json-box.vue
@@ -15,6 +15,7 @@ import JsonNumber from './types/json-number';
 import JsonBoolean from './types/json-boolean';
 import JsonObject from './types/json-object';
 import JsonArray from './types/json-array';
+import JsonFunction from './types/json-function';
 
 export default {
     name: 'JsonBox',
@@ -44,6 +45,8 @@ export default {
                 return 'String';
             } else if (typeof this.value === 'boolean') {
                 return 'Boolean';
+            } else if (typeof this.value === 'function') {
+                return 'Function';
             }
         },
         isObject() {
diff --git a/types/json-function.vue b/types/json-function.vue
new file mode 100644
index 0000000..af50ffb
--- /dev/null
+++ b/types/json-function.vue
@@ -0,0 +1,18 @@
+<template>
+    <span class="json-function">&lt;function&gt;</span>
+</template>
+
+<script>
+export default {
+    name: 'JsonFunction',
+    props: {
+        jsonValue: Function
+    }
+};
+</script>
+
+<style lang="scss">
+.json-function {
+    color: #067bca;
+}
+</style>