Skip to content

n-vtabs-content 垂直选项卡内容分区 ​

n-vtabs 的右侧内容分区容器:包住分区内容并传 tabIndex(0 起连续编号,与轨道数据顺序对应)。挂载后自动向所属 n-vtabs 上报自身高度,作为联动滚动定位的依据。

  1. 必须与 n-vtabs 配合使用(经 provide/inject 建立通道);脱离 n-vtabs 单独使用时只渲染内容,不上报
  2. linkage = false 时不依赖本组件,直接在 n-vtabs 默认插槽里放内容即可
  3. 分区高度自动监听并上报;图片加载、分页追加和内容重排无需调用者重测

平台兼容性 ​

App H5 微信小程序 支付宝小程序 百度小程序 头条小程序 QQ小程序
√ √ √ × × × ×

API ​

属性 ​

参数 说明 类型 默认值 可选值
tab-index 分区序号(0 起连续编号,与轨道数据顺序一一对应;联动定位按它匹配高度) Number 0 -
custom-class 挂到根节点的额外 class(类需定义在组件样式表内) String "" -
custom-style 根节点行内样式,如 "background-color:#ffffff" String "" 与 css 相同

插槽 ​

插槽名 说明
default 分区内容,完全由页面排版

实现说明 ​

挂载测量与高度上报扩展为内部尺寸监听:App / Web 使用元素尺寸观察器,小程序共用库内检测时钟;图片加载和插槽内容重排自动上报。页面隐藏停止监听,分区序号变化时重新登记,卸载释放。

记录 · 思考 · 创作