@pixui-dev/pixui-react-virtualwaterfall - npm Package Compare versions

Comparing version 1.0.8 to 1.0.9

package.json

 {
   "name": "@pixui-dev/pixui-react-virtualwaterfall",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "pixui 高性能React虚拟瀑布流组件",
@@ -5,0 +5,0 @@ "publishConfig": {

README.md

@@ -127,4 +127,12 @@ # VirtualWaterfallList 虚拟瀑布流组件
 
-## 组件方法
+## 公共信息
 
+ 
+### 公共属性
+| **属性名** | **类型** | **说明** | **默认值** | **版本** |
+| --- | --- | --- | --- | --- |
+| renderData | any[] | 具体的渲染数据，只读 | - | 1.0.9 |
+| containerRef | ref | 外层容器的 Dom Ref | - | 1.0.9 |
+| contentRef | ref | 内容容器的 Dom Ref | - | 1.0.9 |
+
 ### 公共方法
@@ -135,7 +143,8 @@ | **方法名** | **参数** | **返回值** | **说明** |
 | getScrollTop | - | number | 获取当前滚动位置 |
-| scrollTo | (scrollLeft: number, scrollTop: number) | void | 设定滚动距离 |
+| scrollTo | (scrollLeft: number, scrollTop: number) | void | 设定滚动距离(1.0.8) |
 | updateItemByIndex | (index: number, item: any) | void | 更新指定索引的项目数据 |
 | removeItemByIndex | (index: number) | void | 删除指定索引的项目 |
 | addSubData | (data: any[]) | void | 添加子数据到列表末尾 |
-| layoutItemsFromIndex | (index: number) | void | 从指定索引开始重新计算布局 |
+| addSubDataAtIndex | (data: any[], index) | void | 在指定索引添加子数据(1.0.9)  |
+| layoutItemsFromIndex | (index: number) | void | 从指定索引开始重新计算布局(1.0.6) |
 | finishPullDownRefresh | - | void |  手动完成下拉刷新，结束刷新状态 |
@@ -1002,2 +1011,6 @@
 
+### 1.0.9
+1. 暴露 containerRef, contentRef，提供 getLayoutInfoByIndex 获取指定 index 的 排版信息。
+2. 添加 addSubDataAtIndex 用于在指定索引添加，一个或者多个渲染信息。
+
 ### 1.0.8
@@ -1004,0 +1017,0 @@ 1. 添加 scrollTo 方法

src/VirtualWaterfall.d.ts

@@ -282,3 +282,3 @@ import { h, Component, JSX } from 'preact';
      */
-    private containerRef;
+    containerRef: import("preact").RefObject<HTMLDivElement>;
     /**
@@ -289,3 +289,3 @@ * 内容DOM引用
      */
-    private contentRef;
+    contentRef: import("preact").RefObject<HTMLDivElement>;
     /** =================== 数据相关 =================== */
@@ -455,2 +455,15 @@ /**
     /**
+     * 获取指定索引的项目
+     * @param {number} index - 要获取的项目索引
+     * @returns {any} 项目数据
+     */
+    getLayoutInfoByIndex(index: number): {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+        columnIndex: number;
+        index: number;
+    };
+    /**
      * 更新指定索引的项目
@@ -470,4 +483,11 @@ * @param {number} index - 要更新的项目索引
      */
-    addSubData(data: any[]): void;
+    addSubData(data: any[]): any[];
     /**
+     * 在指定索引添加子数据
+     * @param {any[]} data - 要添加的数据
+     * @param {number} index - 要添加的数据索引
+     *
+     * */
+    addSubDataAtIndex(data: any[], index: number): void;
+    /**
      * 从指定索引开始重新计算布局
@@ -474,0 +494,0 @@ * @param {number} index - 要重新计算布局的索引

src/VirtualWaterfall.js

@@ -536,2 +536,18 @@ var __extends = (this && this.__extends) || (function () {
     /**
+     * 获取指定索引的项目
+     * @param {number} index - 要获取的项目索引
+     * @returns {any} 项目数据
+     */
+    VirtualWaterfall.prototype.getLayoutInfoByIndex = function (index) {
+        var layout = this.cachedLayouts[index];
+        return {
+            x: layout.x,
+            y: layout.y,
+            width: layout.width,
+            height: layout.height,
+            columnIndex: layout.columnIndex,
+            index: layout.index,
+        };
+    };
+    /**
      * 更新指定索引的项目
@@ -599,4 +615,32 @@ * @param {number} index - 要更新的项目索引
         }
+        return this.renderData;
     };
     /**
+     * 在指定索引添加子数据
+     * @param {any[]} data - 要添加的数据
+     * @param {number} index - 要添加的数据索引
+     *
+     * */
+    VirtualWaterfall.prototype.addSubDataAtIndex = function (data, index) {
+        var _a, _b;
+        // 在指定索引处插入数据
+        (_a = this.renderData).splice.apply(_a, __spreadArray([index, 0], data, false));
+        // 更新缓存布局：在cachedLayouts的index位置插入data.length个空位
+        var emptyLayouts = new Array(data.length).fill(null);
+        (_b = this.cachedLayouts).splice.apply(_b, __spreadArray([index, 0], emptyLayouts, false));
+        // 需要重新计算布局的信息：从插入位置开始到结束
+        var needLayoutIndex = index;
+        var needLayoutCount = this.renderData.length - needLayoutIndex;
+        // 重新计算布局
+        this.layoutItems(needLayoutIndex, needLayoutCount);
+        // 获取需要刷新的索引（当前可见区域中索引大于等于index的项目）
+        var refreshIndices = this.lastVisibleIndices.filter(function (i) { return i >= index; });
+        // 回收受影响的项目
+        this.handleExitingItems(refreshIndices);
+        // 重新设置可视区域元素
+        this.handleEnteringItems(refreshIndices, this.renderData);
+        // 强制更新
+        this.forceUpdate();
+    };
+    /**
      * 从指定索引开始重新计算布局
@@ -603,0 +647,0 @@ * @param {number} index - 要重新计算布局的索引

No alert changes

Improved metrics

Total package byte prevSize

111284

2.91%

Lines of code

1796

3.7%

Number of lines in readme file

1027

1.28%

No dependency changes