@hzab/list-render-mobile NPM

@hzab/list-render-mobile

组件模板

node@14.21

组件

注意事项

new DataModel() hooks 写法时，注意避免 hooks 重复创建实例，导致 query 丢失
- 非动态 query 参数使用 modelParams 参数直接自动生成 model。query 中的值必须是实例化的时候就存在（不支持动态 query 参数）。
- 动态 query 参数使用 useDataModel(); 生成 model。query 允许自行配置监听的动态参数

示例

import { useDataModel } from "@hzab/data-model";
import Demo from "@hzab/list-render-mobile";

// 使用 modelParams 参数实例化 DataModel，不支持动态参数
function Test() {
  const modelParams = {
    getListApi: "/getList",
    query: { orgId: getUrlParam("orgId") },
  };

  return <Demo modelParams={modelParams} />;
}

// 使用 useDataModel 实例化 DataModel，支持动态参数
function Test2({ orgId }) {
  const model = useDataModel(
    {
      getListApi: "/getList",
      query: { orgId },
    },
    [orgId],
  );

  return <Demo model={model} />;
}

API

InfoPanel Attributes

参数	类型	必填	默认值	说明
model	Object	是	-	数据模型，包含 CURD 接口信息，传入 DataModel 的实例
modelParams	Object	否	-	不支持动态参数。传入 DataModel 的的参数，内部自动创建 Model 实例。
schema	Object		-	数据信息的 schema
listData	Array	否	-	本地列表数据
closeAutoRequest	Boolean		false	是否关闭加载完毕后自动发起请求。true 时组件 didMount 不自动发起请求
idKey	string	否	id	唯一值字段的 key
ItemRender	Function		-	子项渲染组件
virtualized	Boolean		false	是否启用虚拟滚动
listHeight	number		-	列表高度，优先级大于 isAutoHeight 计算的高度
isAutoHeight	Boolean		false	是否自动计算高度（视窗到列表顶部的距离，clientHeight - boxRec.top）
rowHeight	number		10	启用虚拟滚动时，每行的高度（单位：像素，优先级高于 pageRow）
pageRow	number		10	启用虚拟滚动时，每页显示的行数