zuaa
/
vue-vben-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(demo): add `JsonPreview` demo 

添加JsonPreview组件的使用演示

close: #1146
This commit is contained in:
无木 2021-09-06 20:36:19 +08:00
parent 044e2e4e86
commit 83c1683bfd
1 changed files with 10 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/views/demo/editor/json/index.vue
View File

@ -14,8 +14,8 @@
</PageWrapper> </PageWrapper>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref } from 'vue'; import { defineComponent, ref, unref, h } from 'vue';
import { CodeEditor } from '/@/components/CodeEditor'; import { CodeEditor, JsonPreview } from '/@/components/CodeEditor';
import { PageWrapper } from '/@/components/Page'; import { PageWrapper } from '/@/components/Page';
import { Radio, Space, Modal } from 'ant-design-vue'; import { Radio, Space, Modal } from 'ant-design-vue';
@ -82,7 +82,14 @@
} }
function showData() { function showData() {
Modal.info({ title: '编辑器当前值', content: value.value }); if (unref(modeValue) === 'application/json') {
Modal.info({
title: '编辑器当前值',
content: h(JsonPreview, { data: JSON.parse(value.value) }),
});
} else {
Modal.info({ title: '编辑器当前值', content: value.value });
}
} }
return { value, modeValue, handleModeChange, showData }; return { value, modeValue, handleModeChange, showData };