jsonModal.vue 888 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. <template>
  2. <a-modal
  3. title="JSON数据"
  4. :footer="null"
  5. :visible="visible"
  6. @cancel="handleCancel"
  7. :destroyOnClose="true"
  8. wrapClassName="code-modal-9136076486841527"
  9. style="top:20px;"
  10. width="850px"
  11. >
  12. <previewCode :editorJson="editorJson" :formData="formData"/>
  13. </a-modal>
  14. </template>
  15. <script>
  16. /*
  17. * author kcz
  18. * date 2019-11-20
  19. * description 生成json Modal
  20. */
  21. import previewCode from "../../PreviewCode/index";
  22. export default {
  23. name: "JsonModal",
  24. data() {
  25. return {
  26. formData:{},//保存表单数据
  27. visible: false,
  28. editorJson: "",
  29. jsonData: {}
  30. };
  31. },
  32. watch: {
  33. visible(val) {
  34. if (val) {
  35. this.editorJson = JSON.stringify(this.jsonData, null, "\t");
  36. }
  37. }
  38. },
  39. components: {
  40. previewCode
  41. },
  42. methods: {
  43. handleCancel() {
  44. this.visible = false;
  45. }
  46. }
  47. };
  48. </script>