feat: cover 组件支持嵌套

src/platforms/app-plus/view/components/ad/index.vue

@@ -73,6 +73,7 @@ export default {
     }
   },
   mounted () {
+    this._onParentReady(() => {
       this._adId = 'AdView-' + this._newGUID()
       const adStyle = Object.assign({
         id: this._adId
@@ -120,6 +121,7 @@ export default {
       UniViewJSBridge.subscribe(this._callbackId, this._handleAdData.bind(this))
 
       this._request()
+    })
   },
   beforeDestroy () {
     this.adView && this.adView.close()

src/platforms/app-plus/view/components/cover-view/index.vue

@@ -15,12 +15,17 @@ export default {
   render (createElement) {
     let coverContent = ''
     const $slots = this.$slots.default || []
+    const _slots = $slots.filter(node => node.tag)
+    if (!_slots.length) {
       $slots.forEach(node => {
         if (!node.tag) {
           coverContent += node.text || ''
         }
       })
       this.coverContent = coverContent
+    } else {
+      coverContent = _slots
+    }
     return createElement('uni-cover-view', {
       on: {
         on: this.$listeners
@@ -28,7 +33,7 @@ export default {
     }, [createElement('div', {
       ref: 'container',
       staticClass: 'uni-cover-view'
-    }, [coverContent])])
+    }, [].concat(coverContent))])
   }
 }
 </script>
@@ -48,5 +53,6 @@ uni-cover-view[hidden] {
 uni-cover-view .uni-cover-view {
   width: 100%;
   height: 100%;
+  visibility: hidden;
 }
 </style>

src/platforms/app-plus/view/components/map/index.vue

@@ -189,6 +189,7 @@ export default {
     }
   },
   mounted () {
+    this._onParentReady(() => {
       const mapStyle = Object.assign({}, this.attrs, this.position)
       if (this.latitude && this.longitude) {
         mapStyle.center = new plus.maps.Point(this.longitude, this.latitude)
@@ -217,6 +218,7 @@ export default {
       this._addMarkers(this.markers)
       this._addMapLines(this.polyline)
       this._addMapCircles(this.circles)
+    })
   },
   beforeDestroy () {
     this.map && this.map.close()

src/platforms/app-plus/view/components/video/index.vue

@@ -197,6 +197,7 @@ export default {
     }
   },
   mounted () {
+    this._onParentReady(() => {
       const video = this.video = plus.video.createVideoPlayer('video' + Date.now(), Object.assign({}, this.attrs, this.position))
       plus.webview.currentWebview().append(video)
       if (this.hidden) {
@@ -223,6 +224,7 @@ export default {
           this.$trigger(key, {}, { ...e.detail })
         })
       })
+    })
   },
   beforeDestroy () {
     this.video && this.video.close()

src/platforms/app-plus/view/components/web-view/index.vue

@@ -93,6 +93,7 @@ export default {
     }
   },
   mounted () {
+    this._onParentReady(() => {
       this.htmlId = WEBVIEW_ID_PREFIX + this.$page.id
       insertHTMLWebView({
         htmlId: this.htmlId
@@ -102,6 +103,7 @@ export default {
         webviewStyles: this.webviewStyles
       })
       UniViewJSBridge.publishHandler(WEBVIEW_INSERTED, {}, this.$page.id)
+    })
   },
   beforeDestroy () {
     removeHTMLWebView()

src/platforms/app-plus/view/mixins/cover.js

@@ -8,7 +8,8 @@ export default {
   name: 'Cover',
   data () {
     return {
-      style: {}
+      style: {},
+      parentPosition: {}
     }
   },
   computed: {
@@ -17,12 +18,12 @@ export default {
       for (const key in this.position) {
         let val = this.position[key]
         const valNumber = parseFloat(val)
-        const parentValNumber = parseFloat(this._nativeParent.position[key])
+        const parentValNumber = parseFloat(this.parentPosition[key])
         if (key === 'top' || key === 'left') {
           val = Math.max(valNumber, parentValNumber) + 'px'
         } else if (key === 'width' || key === 'height') {
           const base = key === 'width' ? 'left' : 'top'
-          const parentStart = parseFloat(this._nativeParent.position[base])
+          const parentStart = parseFloat(this.parentPosition[base])
           const viewStart = parseFloat(this.position[base])
           const diff1 = Math.max(parentStart - viewStart, 0)
           const diff2 = Math.max((viewStart + valNumber) - (parentStart + parentValNumber), 0)
@@ -91,16 +92,10 @@ export default {
     this._nativeParent = $parent
   },
   mounted () {
+    this._onParentReady((parentPosition) => {
+      this.parentPosition = this._nativeParent.position || parentPosition
       this._updateStyle()
-    const $nativeParent = this._nativeParent
-    if ($nativeParent.isNative) {
-      if ($nativeParent._isMounted) {
       this._onCanInsert()
-      } else {
-        $nativeParent.onCanInsertCallbacks.push(() => {
-          this._onCanInsert()
-        })
-      }
       this.$watch('hidden', (val) => {
         this.cover && this.cover[val ? 'hide' : 'show']()
       })
@@ -115,7 +110,7 @@ export default {
         }
       }, { deep: true })
       this.$on('uni-view-update', this._requestStyleUpdate)
-    }
+    })
   },
   beforeDestroy () {
     if (this._nativeParent.isNative) {
@@ -139,7 +134,7 @@ export default {
       for (const key in this.position) {
         let val = this.position[key]
         if (key === 'top' || key === 'left') {
-          val = Math.min((parseFloat(val) - parseFloat(this._nativeParent.position[key])), 0) + 'px'
+          val = Math.min((parseFloat(val) - parseFloat(this.parentPosition[key])), 0) + 'px'
         }
         position[key] = val
       }

src/platforms/app-plus/view/mixins/native.js

@@ -26,15 +26,23 @@ export default {
       hidden: false
     }
   },
+  provide () {
+    return {
+      parentOnDraw: this._onDraw
+    }
+  },
+  inject: {
+    parentOnDraw: { default: null }
+  },
   created () {
     this.isNative = true
     this.onCanInsertCallbacks = []
+    this.onDrawCallbacks = []
   },
   mounted () {
     this._updatePosition()
-    this.$nextTick(() => {
     this.onCanInsertCallbacks.forEach(callback => callback())
-    })
+    this.onCanInsertCallbacks = null
     this.$on('uni-view-update', this._requestPositionUpdate)
   },
   methods: {
@@ -60,6 +68,40 @@ export default {
         delete this._positionUpdateRequest
         this._updatePosition()
       })
+    },
+    _onParentReady (parentReadyCallback) {
+      const callback = (parentPosition) => {
+        parentReadyCallback(parentPosition)
+        this.onDrawCallbacks.forEach(callback => callback(this.position))
+        this.onDrawCallbacks = null
+      }
+      this._onSelfReady(() => {
+        if (this.parentOnDraw) {
+          this.parentOnDraw(callback)
+        } else {
+          callback({
+            top: '0px',
+            left: '0px',
+            width: Number.MAX_SAFE_INTEGER + 'px',
+            height: Number.MAX_SAFE_INTEGER + 'px',
+            position: 'static'
+          })
+        }
+      })
+    },
+    _onSelfReady (callback) {
+      if (this.onCanInsertCallbacks) {
+        this.onCanInsertCallbacks.push(callback)
+      } else {
+        callback()
+      }
+    },
+    _onDraw (callback) {
+      if (this.onDrawCallbacks) {
+        this.onDrawCallbacks.push(callback)
+      } else {
+        callback(this.position)
+      }
     }
   }
 }