美文网首页Weex
Weex——list

Weex——list

作者: 阿凡提说AI | 来源:发表于2017-01-27 19:01 被阅读1438次

    概括

    这是一个提供了常见的列表功能的核心组件,通过平滑滚动和内存回收提供了更好的用户体验和性能

    子组件

    注意: list的子组件只能包括 cell, header, refresh, loading 或者是 fix定位的组件. 其他形式的组件将不能被正确的渲染

    • cell 定义了展现在list中的元件的属性和行为
    • header 0.6.1 当 header到达屏幕顶部时,将会固定在屏幕顶部 .
    • refresh 组件可以用来给列表添加下拉刷新的功能
    • loading 组件可以用来给列表添加上拉加载更多的功能
    • refresh and loading 请查看 refresh-loading.

    属性

    loadmoreoffset: <number> 触发loadmore事件所需要的滚动条距离list底部的垂直偏移距离.当list的滚动条滚动到足够接近list底部时将会触发load more这个事件

    样式

    公共样式

    • 支持flexbox 等样式
    • 支持box model 等样式
    • 支持position 等样式
    • 支持opacity, background-color 等

    事件

    loadmore: 如果列表滚动到底部将会立即触发这个事件,你可以在这个事件的处理函数中加载下一页的列表项.
    公共事件
    支持click 事件
    支持 appear / disappear 事件
    scrollToElement(node, options)
    让页面滚动到那个对应的节点,这个API只能在scroller和list组件中用。
    要在你的.we文件中使用这个API,可以使用require('@weex-module/dom').scrollToElement。

    • node(Node): 你要滚动到的那个节点
    • options(object): 如下选项
      offset(number): 一个到其可见位置的偏移距离,默认是0
    var dom = require('@weex-module/dom');
    dom.scrollToElement(this.$el('someId'), {offset: 10});
    

    约束

    不允许相同方向的list或者scroller互相嵌套.换句话说就是嵌套的lists/scroller必须是不同的方向

    举个例子,不允许一个垂直方向的list嵌套的一个垂直方向的scroller中,但是一个垂直方向的list是可以嵌套的一个水平方向的list或者scroller中的.

    相关文章

      网友评论

        本文标题:Weex——list

        本文链接:https://www.haomeiwen.com/subject/kkkfittx.html