fix: props virtualHeight

README.md

@@ -68,7 +68,7 @@ Vue.use(liteVirtualList)
 | screen   | Array    | [ 1 , 1 ]|   |  The number of screens rendered before and after the viewable area. The default value is `[1,1]`, rendering one screen before and one screen after the viewable area. Example: `screen = [2,3]` means that two screens are rendered in front of the viewable area and three screens are rendered behind the viewable area. |
 | distance   | Number \| String    |50|    |  The distance to trigger the `loadmore` callback when the page scrolls. The default is `50` |
 | interval   | Number \| String    | 0|   | `Scroll` event trigger interval, default is `0`  |
-| virtualHieght   | String    | 100%|   |  The height of the virtual list is' 100% 'by default. When the type is `fixed`, the height will be calculated dynamically according to the `size` and `remain` attributes. This value is not required to be passed in. When the type is `variable` or `waterfall`, if this property is not passed in, the external container must declare a height value. |
+| virtualHeight   | String    | 100%|   |  The height of the virtual list is' 100% 'by default. When the type is `fixed`, the height will be calculated dynamically according to the `size` and `remain` attributes. This value is not required to be passed in. When the type is `variable` or `waterfall`, if this property is not passed in, the external container must declare a height value. |
 | unit   | String    | px |   | Unit, default is `PX` |
 | deleteId   |  Number \| String  |   |  | When dynamically deleting an item, the ID value of the current item needs to be passed in. When the type is `fixed`, the deletion ID is not passed in, and the current item is deleted directly `this.data.splice (index, 1)`delete is OK. At this time, the high value will be calculated dynamically
 | marginBottom   |  Number \| String     |  0 |  |  The distance between items. This property is provided only when type is `waterfall`. It is invalid when type is `fixed` or `variable` |

README_zh-CN.md

@@ -67,7 +67,7 @@ Vue.use(liteVirtualList)
 | screen   | Array    | [ 1 , 1 ]|   |  可视区前后渲染的屏数。 默认值为`[1,1]`,可视区前后各渲染一屏。 例：:screen="[2,3]" 表示可视区前面渲染两屏，可视区后面渲染三屏。 |
 | distance   | Number \| String    |50|    |  页面滚动时触发`loadMore`回调的距离,默认为`50` |
 | interval   | Number \| String    | 0|   |  `scroll`事件触发间隔,默认为`0` |
-| virtualHieght   | String    | 100%|   |  虚拟列表的高度,默认为`100%`。当type为`fixed`时，高度会根据`size`和`remain`属性动态计算出来，不用传入此值。当type为`variable`或 `waterfall`时，若不传入此属性，外部容器必须声明一个高度值。 |
+| virtualHeight   | String    | 100%|   |  虚拟列表的高度,默认为`100%`。当type为`fixed`时，高度会根据`size`和`remain`属性动态计算出来，不用传入此值。当type为`variable`或 `waterfall`时，若不传入此属性，外部容器必须声明一个高度值。 |
 | unit   | String    | px |   |  单位，默认为`px` |
 | deleteId   |  Number \| String  |   |  | 动态删除某一项时需要传入当前项目的id值,当type为`fixed`时，不传deleteId,直接`this.data.splice(index,1)`删除也行,此时内部会动态计算高度
 | marginBottom   |  Number \| String     |  0 |  |  每项item的间隔距离。 此属性专门为`type='waterfall'`时提供,type为`fixed`或`variable`时此属性无效 |

src/lib/virtual-list.vue

@@ -68,7 +68,7 @@ export default {
       required: false,
       default: 0,
     },
-    virtualHieght: {
+    virtualHeight: {
       type: String,
       required: false,
       default: '100%',
@@ -206,12 +206,12 @@ export default {
         break
       case virtualType.VARIABLE:
         this.variableData = []
-        this.$refs.virtualList.style.height = this.virtualHieght
+        this.$refs.virtualList.style.height = this.virtualHeight
         this.variableData = this.getVisiblePosition(this.data)
         break
       case virtualType.WATERFALL:
         // 必须设置scrollList高度否则scrollList的高度会被 容器内容撑起造成高度与virtualList不同 则会出现滚动条偏移问题
-        this.$refs.virtualList.style.height = this.$refs.scrollList.style.height = this.virtualHieght
+        this.$refs.virtualList.style.height = this.$refs.scrollList.style.height = this.virtualHeight
         this.leftEnd = this.leftStart + this.remain
         this.rightEnd = this.rightStart + this.remain
         if (this.data && this.data.length) {
@@ -433,4 +433,4 @@ export default {
 .right-item {
   overflow: hidden;
 }
-</style>
+</style>