JsonEditor.vue 698 B

123456789101112131415161718192021222324252627282930313233343536
  1. <script setup lang="ts">
  2. import { ContentWrap } from '@/components/ContentWrap'
  3. import { JsonEditor } from '@/components/JsonEditor'
  4. import { useI18n } from '@/hooks/web/useI18n'
  5. import { ref, watch } from 'vue'
  6. const { t } = useI18n()
  7. const defaultData = ref({
  8. title: '标题',
  9. content: '内容'
  10. })
  11. watch(
  12. () => defaultData.value,
  13. (val) => {
  14. console.log(val)
  15. },
  16. {
  17. deep: true
  18. }
  19. )
  20. setTimeout(() => {
  21. defaultData.value = {
  22. title: '异步标题',
  23. content: '异步内容'
  24. }
  25. }, 4000)
  26. </script>
  27. <template>
  28. <ContentWrap :title="t('richText.jsonEditor')" :message="t('richText.jsonEditorDes')">
  29. <JsonEditor v-model="defaultData" />
  30. </ContentWrap>
  31. </template>