Open vivine opened 6 years ago
场景: mip-bind 配合 mip-img 使用的时候会导致报错。 <mip-img m-bind:src="xxx.com/123.jpg"></mip-img>
<mip-img m-bind:src="xxx.com/123.jpg"></mip-img>
原因: 因为 mip-bind 的时候触发了 mip-img 组件里边的 attributeChangedCallback。
https://github.com/mipengine/mip/blob/92530d8e2e3cdb7a6834cf037efadd881cd8d93d/src/components/mip-img.js#L299-L303
而对于mip-img来说,如果组件没有进入视口范围的话,里边是没有创建img标签的。上面的代码 Line 301 就会报错。
解决办法:
customElem.prototype.attributeChangedCallback = function (attributeName, oldValue, newValue, namespace) { var img = this.element.querySelector('img'); if (img && attributeName === 'src' && oldValue !== newValue) { img.src = newValue; } };
场景: mip-bind 配合 mip-img 使用的时候会导致报错。
<mip-img m-bind:src="xxx.com/123.jpg"></mip-img>
原因: 因为 mip-bind 的时候触发了 mip-img 组件里边的 attributeChangedCallback。
https://github.com/mipengine/mip/blob/92530d8e2e3cdb7a6834cf037efadd881cd8d93d/src/components/mip-img.js#L299-L303
而对于mip-img来说,如果组件没有进入视口范围的话,里边是没有创建img标签的。上面的代码 Line 301 就会报错。
解决办法: