parse.nvue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <template>
  2. <view class="u-content">
  3. <u-parse container-style="padding: 20px" :content="content" domain="https://6874-html-foe72-1259071903.tcb.qcloud.la/demo" lazy-load scroll-table selectable use-anchor :tag-style="tagStyle" @load="load" @ready="ready" @imgTap="imgTap" @linkTap="linkTap" />
  4. </view>
  5. </template>
  6. <script>
  7. const content = require('./content')
  8. export default {
  9. data() {
  10. return {
  11. content: '',
  12. tagStyle: {
  13. table: 'box-sizing: border-box; border-top: 1px solid #dfe2e5; border-left: 1px solid #dfe2e5;',
  14. th: 'border-right: 1px solid #dfe2e5; border-bottom: 1px solid #dfe2e5;',
  15. td: 'border-right: 1px solid #dfe2e5; border-bottom: 1px solid #dfe2e5;',
  16. li: 'margin: 5px 0;'
  17. }
  18. }
  19. },
  20. onLoad() {
  21. // 模拟网络请求
  22. setTimeout(() => {
  23. this.content = content
  24. }, 200)
  25. },
  26. methods: {
  27. load() {
  28. // dom 结构加载完毕时触发
  29. },
  30. ready() {
  31. // 渲染完毕时触发
  32. },
  33. imgTap() {
  34. // 图片被点击时触发
  35. },
  36. linkTap() {
  37. // 链接被点击时触发
  38. }
  39. }
  40. }
  41. </script>
  42. <style lang="scss">
  43. .u-content {
  44. padding: 24rpx;
  45. font-size: 32rpx;
  46. color: $u-content-color;
  47. line-height: 1.6;
  48. }
  49. </style>