fix: cannot read property 'getBoundingClientRect' of undefined

Author: staticdeng

README.en-US.md

@@ -155,7 +155,7 @@ export default {
 | on-refresh | Will be Emitted when pull refresh | _function_ | - |
 | pulling-text | The Text when pulling in refresh | _string_ | `Pull down to refresh` |
 | loosing-text | The Text when loosing in refresh | _string_ | `Loosing to refresh` |
-| loading-text | The Text when loading in refresh | _string_ | `Refreshing` |
+| refresh-text | The Text when loading in refresh | _string_ | `Refreshing` |
 | success-text | The Text when loading success in refresh | _string_ | `Refresh success` |
 | show-success-text | Whether to show `success-text` | _boolean_ | `true` |
 | pull-distance | The distance to trigger the refresh status | _number \| string_ | `50` |

README.md

@@ -155,14 +155,14 @@ export default {
 | on-refresh | 顶部下拉触发 | _function_ | - |
 | pulling-text | 下拉显示文本 | _string_ | `下拉刷新` |
 | loosing-text | 释放显示文本 | _string_ | `释放刷新` |
-| loading-text | 正在刷新显示文本 | _string_ | `正在刷新` |
+| refresh-text | 正在刷新显示文本 | _string_ | `正在刷新` |
 | success-text | 刷新完成显示文本 | _string_ | `刷新完成` |
 | show-success-text | 是否显示`success-text` | _boolean_ | `true` |
 | pull-distance | 触发正在刷新状态的距离 | _number \| string_ | `50` |
 | head-height | 正在刷新显示区域的高度  | _number \| string_ | `50` |
 | animation-duration | 下拉刷新动画持续时间 | _number \| string_ | `200` |
 | on-loadmore | 滚动到底部触发 | _function_ | - |
-| immediate-check | 是否在mounted之后立即检查 | _boolean_ | `true` |
+| immediate-check | 是否立即触发数据加载；默认是，否的话则自己定义触发数据加载时机 | _boolean_ | `true` |
 | load-offset | 当滚动条到底部的距离小于 `load-offset` 时，会发出 `on-loadmore` | _number \| string_ | `50` |
 | finished | 数据是否加载完毕，改变为true，则会显示`finished-text` | _boolean_ | `false` |
 | error | 数据是否加载错误，`on-loadmore`只有在点击错误文本时才会触发，需要`sync`修饰符 | _boolean_ | `false` |

lib/index.js

@@ -1,6 +1,6 @@
 {
   "name": "vuejs-loadmore",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "A pull-down refresh and pull-up loadmore scroll component for Vue.js",
   "entry": "packages/index.js",
   "main": "lib/index.js",
@@ -28,9 +28,6 @@
   ],
   "author": "staticdeng",
   "license": "MIT",
-  "dependencies": {
-    "vue": "^2.6.14"
-  },
   "devDependencies": {
     "@babel/core": "^7.16.0",
     "@babel/preset-env": "^7.16.4",
@@ -56,6 +53,7 @@
     "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-vue": "^5.1.9",
+    "vue": "^2.6.14",
     "vue-jest": "4.0.0-rc.0",
     "vue-template-compiler": "^2.6.14"
   },

lib/index.module.js

@@ -282,12 +282,12 @@ export default {
         }
 
         const scrollerHeight = scrollerRect.bottom - scrollerRect.top;
-
-        if (!scrollerHeight) {
+        const placeholder = this.$refs.placeholder;
+        if (!scrollerHeight || !placeholder) {
           return false;
         }
 
-        const placeholderRect = this.$refs.placeholder.getBoundingClientRect();
+        const placeholderRect = placeholder.getBoundingClientRect();
         // 取绝对值，placeholderRect在scrollerRect容器的正负loadOffset区间则达到底部
         const bottomReached = Math.abs(placeholderRect.bottom - scrollerRect.bottom) <= loadOffset;