Weex——scroller

概述

scroller是一个竖直的,可以容纳多个排成一列的子组件的滚动器。 如果子组件的总高度高于其本身,那么所有的子组件都可滚动。

注意: <scroller> 可以当作根元素或者嵌套元素使用。此组件的滚动方向是列的形式(原文: The scroll direction of this component is column),不可更改。

子组件

这类组件支持任意类型的weex组件作为其自组件。

属性

  • show-scrollbar: <boolean> true | false. 这个属性决定滚动条是否现实,默认是true
  • scroll-direction: <string> 定义子组件的滚动方向, horizontal 或者 vertical。
    其他属性请查看 公共属性.

样式

共公样式
支持flexbox相关样式
支持box model相关样式
支持position相关样式
支持opacity, background-color等.

事件

公共事件

  • 支持 click 事件。 查阅 公共事件
  • 支持 appear / disappear 事件。 查阅 公共事件

示例

<template>
  <scroller>
    <div repeat="{{list}}">
      <text>{{name}}: ${{price}}</text>
    </div>
  </scroller>
</template>
 
<script>
  module.exports = {
    data: {
      list: [
        {name: '...', price: 100},
        {name: '...', price: 500},
        {name: '...', price: 1.5},
        ...
      ]
    }
  }
</script>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 在学习weex的过程中看到了常用标签相关的内容,为了自己以后能够快速查阅特整理出此文档。 a 简介组件定义了指向某...
    TyroneTang阅读 4,735评论 1 3
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,010评论 19 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,666评论 25 708
  • 喜欢伊心的原因,她很真挚。希望她可以一直这样。 也希望我可以一直有一颗柔软的心。去书写真挚和体验真挚的情感。
    欧阳叶树阅读 97评论 0 0
  • 一束亮光 作 寒露降,荷叶残, 秋后田畴稻茬乱。 雀群飞落,鸭逐食欢, 旷...
    一束亮光阅读 463评论 1 4