[Solved] Uni.createintersectionobserver Error: Uncaught TypeError: Cannot read property ‘bottom’ of null

Error content

Uncaught TypeError: Cannot read property 'bottom' of null
    at a (chunk-vendors.js:319)
    at chunk-vendors.js:319
    at Array.forEach (<anonymous>)
    at IntersectionObserver.s.<computed>.IntersectionObserver.root (chunk-vendors.js:319)

Cause
the listening element cannot be found
PS: it seems that it only appears from the H5 platform

Solution
in the hide and unload life cycle of the page, cancel listening to elements

onHide:function(){
	this.observer.disconnect();
},
onUnload: function(){
	this.observer.disconnect();
},

Judge whether the element exists during listening, and clear the last listening

Vue.prototype.$lazyImg = function(fn){
	this.observer.disconnect();//The previous ones must be cleared. Otherwise, elements that have been loaded will still be listened to, or if the listened to elements disappear, an error will be reported
	uni.createSelectorQuery().in(this).selectAll('.lazy').boundingClientRect(data => {
		if(data.length > 0){//If there is no lazy element on the page, it will report an error directly, which is really fucking outrageous!
			this.observer.observe('.lazy', (res) => {
				if(res.intersectionRatio > 0){//sometimes, intersectionRatio is undefined
					fn(res.dataset)
				}
			})
		}
	}).exec();
}


Read More: