mirror of
https://github.com/continew-org/continew-admin-ui.git
synced 2026-01-12 05:01:39 +08:00
42 lines
868 B
Vue
42 lines
868 B
Vue
<template>
|
|
<div class="json_pretty_container">
|
|
<vue-json-pretty :path="'res'" :data="JSONObject" :show-length="true" />
|
|
<icon-copy class="copy_icon" @click="onCopy(JSONObject)" />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import VueJsonPretty from 'vue-json-pretty'
|
|
import 'vue-json-pretty/lib/styles.css'
|
|
import { copyText } from '@/utils'
|
|
|
|
defineOptions({ name: 'JsonPretty', inheritAttrs: false })
|
|
|
|
const props = defineProps<{
|
|
json: string
|
|
}>()
|
|
|
|
const JSONObject = computed(() => JSON.parse(props?.json))
|
|
|
|
// 拷贝
|
|
const onCopy = (data: object) => {
|
|
copyText(JSON.stringify(data))
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.json_pretty_container {
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: auto;
|
|
position: relative;
|
|
.copy_icon {
|
|
position: absolute;
|
|
right: 10px;
|
|
top: 10px;
|
|
font-size: 20px;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
</style>
|