今天继续微信小程序学习

微信小程序的组件的使用

今天的项目需要使用 scroll-view组件， 在微信小程序文档中横向滚动的效果在我的页面上无法演示 。光看代码也不知道怎么使用 ，我就把所有代码写入开发程序里发现 ，只需将要横向滚动的内容渲染到scroll-view标签中 例：

<scroll-view class="scroll-view_H" scroll-x="true" style="width: 100%" scroll-left='0' bindscroll="getleft">
			<view class="castsli" wx:for="{{ li.casts }}" wx:key="index">
				<image src="{{ item.avatars.small}}"></image>
				<view>{{ item.name }}</view>
			</view>
	</scroll-view>

在wxss文件里
要给scroll-view标签设置内容不换行以及内容元素改行内块

.scroll-view_H{
  /*内容不换行*/
   white-space: nowrap;   
}

/*横向滚动内容*/
.castsli{
  display: inline-block;
}

总结：新使用的组件最好在编程软件里操作才容易理解