实习日志Day6

今天主要学习了对wxss的操作,针对天气API接口反馈的信息进行布局,主要是美化自己的界面和对界面的加深了解。还讲解了视图容器的用法,对于今天的内容大概掌握了,并在作业中实践。

1.scroll-view

可滚动视图区域。使用竖向滚动时,需要给scroll-view一个固定高度,通过 WXSS 设置 height。组件属性的长度单位默认为px,2.4.0起支持传入单位(rpx/px)。

属性 类型 默认值 必填 说明 最低版本
scroll-x boolean false 允许横向滚动 1.0.0
scroll-y boolean false 允许纵向滚动 1.0.0
upper-threshold number/string 50 距顶部/左边多远时,触发 scrolltoupper 事件 1.0.0
lower-threshold number/string 50 距底部/右边多远时,触发 scrolltolower 事件 1.0.0
scroll-top number/string   设置竖向滚动条位置 1.0.0
scroll-left number/string   设置横向滚动条位置 1.0.0
scroll-into-view string   值应为某子元素id(id不能以数字开头)。设置哪个方向可滚动,则在哪个方向滚动到该元素 1.0.0
scroll-with-animation boolean false 在设置滚动条位置时使用动画过渡 1.0.0
enable-back-to-top boolean false iOS点击顶部状态栏、安卓双击标题栏时,滚动条返回顶部,只支持竖向 1.0.0
bindscrolltoupper eventhandle   滚动到顶部/左边时触发 1.0.0
bindscrolltolower eventhandle   滚动到底部/右边时触发 1.0.0
bindscroll eventhandle   滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} 1.0.0

Bug & Tip

  1. tip: 基础库 2.4.0以下不支持嵌套textareamapcanvasvideo 组件
  2. tipscroll-into-view 的优先级高于 scroll-top
  3. tip: 在滚动 scroll-view 时会阻止页面回弹,所以在 scroll-view 中滚动,是无法触发 onPullDownRefresh
  4. tip: 若要使用下拉刷新,请使用页面的滚动,而不是 scroll-view ,这样也能通过点击顶部状态栏回到页面顶部

2.view

视图容器

属性 类型 默认值 必填 说明 最低版本
hover-class string none 指定按下去的样式类。当 hover-class="none" 时,没有点击态效果 1.0.0
hover-stop-propagation boolean false 指定是否阻止本节点的祖先节点出现点击态 1.5.0
hover-start-time number 50 按住后多久出现点击态,单位毫秒 1.0.0
hover-stay-time number 400 手指松开后点击态保留时间,单位毫秒 1.0.0

 

你可能感兴趣的:(实习日志Day6)