trees.wxml 3.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <!--trees 递归子组件-->
  2. <wxs module="handler">
  3. var inline = {
  4. abbr: 1,
  5. b: 1,
  6. big: 1,
  7. code: 1,
  8. del: 1,
  9. em: 1,
  10. i: 1,
  11. ins: 1,
  12. label: 1,
  13. q: 1,
  14. small: 1,
  15. span: 1,
  16. strong: 1
  17. }
  18. module.exports = {
  19. visited: function (e, owner) {
  20. if (!e.instance.hasClass('_visited'))
  21. e.instance.addClass('_visited')
  22. owner.callMethod('linkpress', e)
  23. },
  24. use: function (item) {
  25. return !item.c && !inline[item.name] && (item.attrs.style || '').indexOf('display:inline') == -1
  26. }
  27. }
  28. </wxs>
  29. <block wx:for="{{nodes}}" wx:key="index" wx:for-item="n">
  30. <!--图片-->
  31. <view wx:if="{{n.name=='img'}}" id="{{n.attrs.id}}" class="_img {{n.attrs.class}}" style="{{n.attrs.style}}" data-attrs="{{n.attrs}}" bindtap="imgtap">
  32. <rich-text nodes="{{[{attrs:{src:loading&&n.load!=2?loading:(lazyLoad&&!n.load?placeholder:n.attrs.src||''),alt:n.attrs.alt||'',width:n.attrs.width||'',style:'-webkit-touch-callout:none;max-width:100%;display:block'+(n.attrs.height?';height:'+n.attrs.height:'')},name:'img'}]}}" />
  33. <image class="_image" src="{{lazyLoad&&!n.load?placeholder:n.attrs.src}}" lazy-load="{{lazyLoad}}" show-menu-by-longpress="{{!n.attrs.ignore}}" data-i="{{index}}" data-index="{{n.attrs.i}}" data-source="img" bindload="loadImg" binderror="error" />
  34. </view>
  35. <!--文本-->
  36. <text wx:elif="{{n.type=='text'}}" decode>{{n.text}}</text>
  37. <text wx:elif="{{n.name=='br'}}">\n</text>
  38. <!--链接-->
  39. <view wx:elif="{{n.name=='a'}}" id="{{n.attrs.id}}" class="_a {{n.attrs.class}}" hover-class="_hover" style="{{n.attrs.style}}" data-attrs="{{n.attrs}}" bindtap="{{canIUse?handler.visited:'linkpress'}}">
  40. <trees class="_node" nodes="{{n.children}}" />
  41. </view>
  42. <!--视频-->
  43. <block wx:elif="{{n.name=='video'}}">
  44. <view wx:if="{{n.lazyLoad&&!n.attrs.autoplay}}" id="{{n.attrs.id}}" class="_video {{n.attrs.class}}" style="{{n.attrs.style}}" data-i="{{index}}" bindtap="loadVideo" />
  45. <video wx:else id="{{n.attrs.id}}" class="{{n.attrs.class}}" style="{{n.attrs.style}}" autoplay="{{n.attrs.autoplay}}" controls="{{!n.attrs.autoplay||n.attrs.controls}}" loop="{{n.attrs.loop}}" muted="{{n.attrs.muted}}" poster="{{n.attrs.poster}}" src="{{n.attrs.source[n.i||0]}}" unit-id="{{n.attrs['unit-id']}}" data-i="{{index}}" data-source="video" binderror="error" bindplay="play" />
  46. </block>
  47. <!--音频-->
  48. <audio wx:elif="{{n.name=='audio'}}" id="{{n.attrs.id}}" class="{{n.attrs.class}}" style="{{n.attrs.style}}" author="{{n.attrs.author}}" autoplay="{{n.attrs.autoplay}}" controls="{{n.attrs.controls}}" loop="{{n.attrs.loop}}" name="{{n.attrs.name}}" poster="{{n.attrs.poster}}" src="{{n.attrs.source[n.i||0]}}" data-i="{{index}}" data-source="audio" binderror="error" bindplay="play" />
  49. <!--广告-->
  50. <ad wx:elif="{{n.name=='ad'}}" class="{{n.attrs.class}}" style="{{n.attrs.style}}" unit-id="{{n.attrs['unit-id']}}" data-source="ad" binderror="error" />
  51. <!--列表-->
  52. <view wx:elif="{{n.name=='li'}}" id="{{n.attrs.id}}" class="{{n.attrs.class}}" style="{{n.attrs.style}};display:flex">
  53. <view wx:if="{{n.type=='ol'}}" class="_ol-bef">{{n.num}}</view>
  54. <view wx:else class="_ul-bef">
  55. <view wx:if="{{n.floor%3==0}}" class="_ul-p1">█</view>
  56. <view wx:elif="{{n.floor%3==2}}" class="_ul-p2" />
  57. <view wx:else class="_ul-p1" style="border-radius:50%">█</view>
  58. </view>
  59. <trees class="_node _li" lazyLoad="{{lazyLoad}}" loading="{{loading}}" nodes="{{n.children}}" />
  60. </view>
  61. <!--富文本-->
  62. <rich-text wx:elif="{{handler.use(n)}}" id="{{n.attrs.id}}" class="_p __{{n.name}}" nodes="{{[n]}}" />
  63. <!--继续递归-->
  64. <trees wx:else id="{{n.attrs.id}}" class="_node _{{n.name}} {{n.attrs.class}}" style="{{n.attrs.style}}" lazyLoad="{{lazyLoad}}" loading="{{loading}}" nodes="{{n.children}}" />
  65. </block>