vue json展示組件

vue-json-viewer 組件，簡單易用的json內容展示組件，可以伸縮

https://www.npmjs.com/package/vue-json-viewer

https://github.com/chenfengjw163/vue-json-viewer/blob/master/README_CN.md

使用 npm:
$ npm install vue-json-viewer --save

使用 yarn:
$ yarn add vue-json-viewer

使用：

<template>
  <json-viewer :value="jsonData"/>
</template>

<script>
  import JsonViewer from 'vue-json-viewer'

  export default {
    name: "jsons",
    components: {
      JsonViewer
    },
    data() {
      return {
        jsonData: {"id": 2, "userid": "3", "result": [{'id': 1, "h": 4}]},

      }
    }
  }
</script>

<style scoped>

</style>

　　

附送: 判斷字符是否為json https://blog.csdn.net/zhanghe_zht/article/details/103460533

原文鏈接：https://blog.csdn.net/zhanghe_zht/article/details/103463590

 

 

另外一個，這個是直接展示開來的 (文本那樣)不可伸縮

https://blog.csdn.net/MtangEr/article/details/123402257