vue中使用外掛格式化json(可伸縮)
阿新 • • 發佈:2018-11-29
原本可以使用<pre>標籤+JSON.stringfy()函式解決json格式化顯示的問題,但是資料量過大希望可以像jsonviewer一樣能夠伸縮,所以使用了vue-json-viewer外掛,mark如下:
1、安裝
$ npm install vue-json-viewer --save
2、使用
<json-viewer :value="jsonData"></json-viewer> <hr /> <json-viewer :value="jsonData" :expand-depth=5 copyable boxed sort></json-viewer>
import Vue from 'vue' import JsonViewer from '../lib' // Import JsonViewer as a Vue.js plugin Vue.use(JsonViewer) new Vue({ el: '#app', data() { return { jsonData: { total: 25, limit: 10, skip: 0, links: { previous: undefined, next: function () {}, } } } } });
3、效果
4、屬性