微信小程序 scroll-view 用法
微信官方文档地址：https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html
微信小程序 scroll-view
前言
提示：以下是本篇文章正文内容，下面案例可供参考
一、scroll-view 是什么？
可滚动视图区域 。
二、scroll-view 使用步骤
1.
代码如下（示例）：
<scroll-view>
/*
scroll-y="true" 允许纵向滚动
必须给 scroll-view css 设置 height 如果不设置就会不生效
还有不能在 scroll-view css 设置 margin 否则 内容没有超出高度就会出现滚动条
scroll-top 设置竖向滚动条位置
*/
/*
scroll-x="true" 允许横向滚动
必须给 scroll-view css
1）. width
2). 必须给scroll-view标签添加white-space:nowrap属性
3). 给子元素添加display:inline-block属性
还有不能在 scroll-view css 设置 margin 否则 内容没有超出高度就会出现滚动条
scroll-left 设置横向滚动条位置
横向滚动开启后不能实现内部在写一个纵向滚动的，样式会直接乱。
*/
</scroll-view>
隐藏滚动条
提示：css
::-webkit-scrollbar {
display:none;
width:0;
height:0;
color:transparent;
}
提示：scroll-view 属性文章来源：https://www.toymoban.com/news/detail-514416.html
<scroll-view
enhanced
:show-scrollbar="false"
// show-scrollbar 滚动条显隐控制 (同时开启 enhanced 属性后生效)
// enhanced 启用 scroll-view 增强特性，启用后可通过 ScrollViewContext 操作 scroll-view
// ScrollViewContext ，通过 wx.createSelectorQuery 的 NodesRef.node 方法获取。 仅在 scroll-view 组件开启 enhanced 属性后生效。
</scroll-view>
提示：设置自定义下拉刷新区域背景颜色文章来源地址https://www.toymoban.com/news/detail-514416.html
refresher-background="#FFF"
// 组件 属性 不是 css
到了这里，关于微信小程序 scroll-view的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
