uni-list-ad.vue 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. <template>
  2. <!-- #ifdef APP-NVUE -->
  3. <cell>
  4. <!-- #endif -->
  5. <view class="uni-list-ad">
  6. <view v-if="borderShow" :class="{'uni-list--border':border,'uni-list-item--first':isFirstChild}"></view>
  7. <ad style="width: 200px;height: 300px;border-width: 1px;border-color: red;border-style: solid;" adpid="1111111111"
  8. unit-id="" appid="" apid="" type="feed" @error="aderror" @close="closeAd"></ad>
  9. </view>
  10. <!-- #ifdef APP-NVUE -->
  11. </cell>
  12. <!-- #endif -->
  13. </template>
  14. <script>
  15. // #ifdef APP-NVUE
  16. const dom = uni.requireNativePlugin('dom');
  17. // #endif
  18. export default {
  19. name: 'UniListAd',
  20. props: {
  21. title: {
  22. type: String,
  23. default: '',
  24. }
  25. },
  26. // inject: ['list'],
  27. data() {
  28. return {
  29. isFirstChild: false,
  30. border: false,
  31. borderShow: true,
  32. }
  33. },
  34. mounted() {
  35. this.list = this.getForm()
  36. if (this.list) {
  37. if (!this.list.firstChildAppend) {
  38. this.list.firstChildAppend = true
  39. this.isFirstChild = true
  40. }
  41. this.border = this.list.border
  42. }
  43. },
  44. methods: {
  45. /**
  46. * 获取父元素实例
  47. */
  48. getForm(name = 'uniList') {
  49. let parent = this.$parent;
  50. let parentName = parent.$options.name;
  51. while (parentName !== name) {
  52. parent = parent.$parent;
  53. if (!parent) return false
  54. parentName = parent.$options.name;
  55. }
  56. return parent;
  57. },
  58. aderror(e) {
  59. console.log("aderror: " + JSON.stringify(e.detail));
  60. },
  61. closeAd(e) {
  62. this.borderShow = false
  63. }
  64. }
  65. }
  66. </script>
  67. <style lang="scss" >
  68. .uni-list-ad {
  69. position: relative;
  70. border: 1px red solid;
  71. }
  72. .uni-list--border {
  73. position: relative;
  74. padding-bottom: 1px;
  75. /* #ifdef APP-PLUS */
  76. border-top-color: $uni-border-color;
  77. border-top-style: solid;
  78. border-top-width: 0.5px;
  79. /* #endif */
  80. margin-left: $uni-spacing-row-lg;
  81. }
  82. /* #ifndef APP-NVUE */
  83. .uni-list--border:after {
  84. position: absolute;
  85. top: 0;
  86. right: 0;
  87. left: 0;
  88. height: 1px;
  89. content: '';
  90. -webkit-transform: scaleY(.5);
  91. transform: scaleY(.5);
  92. background-color: $uni-border-color;
  93. }
  94. .uni-list-item--first:after {
  95. height: 0px;
  96. }
  97. /* #endif */
  98. </style>