推荐一款优雅的Vue JSON 格式化组件：Vue Json Pretty
<template>
<div id="app">
<vue-json-pretty :data="jsonData"></vue-json-pretty>
</div>
</template>
<script>
import VueJsonPretty from 'vue-json-pretty';
import 'vue-json-pretty/lib/styles.css'; // 导入样式
export default {
components: {
VueJsonPretty
},
data() {
return {
jsonData: {
name: "Vue Json Pretty",
version: "1.0.0",
keywords: ["json", "formatter", "vue"]
}
};
}
};
</script>这段代码展示了如何在Vue应用中使用vue-json-pretty组件来格式化并展示JSON数据。首先导入了vue-json-pretty组件及其样式，然后在模板中使用该组件并通过:data属性传递要格式化的JSON对象。
评论已关闭