editor-froala.vue 598 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <template>
  2. <div>
  3. <div class="data">
  4. {{ content }}
  5. </div>
  6. <cl-editor-froala v-model="content" :options="options" @load="onLoad"></cl-editor-froala>
  7. </div>
  8. </template>
  9. <script>
  10. export default {
  11. data() {
  12. return {
  13. options: {
  14. height: '300px'
  15. },
  16. content: ''
  17. };
  18. },
  19. methods: {
  20. onLoad(ref) {
  21. console.log(ref);
  22. }
  23. }
  24. };
  25. </script>
  26. <style lang="stylus" scoped>
  27. .data {
  28. height: 100px;
  29. width: 100%;
  30. border: 1px solid #DCDFE6;
  31. background-color: #fff;
  32. margin-bottom: 10px;
  33. padding: 10px;
  34. box-sizing: border-box;
  35. overflow-y: auto;
  36. word-break: break-all;
  37. }
  38. </style>