微信小程序开发的页面组件

微信小程序开发的页面组件

标签	功能	标签	功能
	视图容器		图标文件
	文本域		复选框
	按钮		单选框
	图片		输入框
	表单		进度条

input组件type属性值：

可选值	说明
text	文本输入键盘
number	数字输入键盘
idcard	身份证输入键盘
digit	带小数点的数字键盘

选择器	示例	说明
.class	.container	选择所有class = "container"的组件
#id	#id	选择 id = "#id"的组件
element	view	选择所有的view组件
element, element	view,text	选择所有view组件和所有text组件
：：after	view::after	在view组件内的后面插入内容
：：before	view::before	在view组件内的前面插入内容

不同设备的rpx与px换算关系：

设备	屏幕宽度	rpx换算px	px换算rpx
iphone4	320	1rpx = 0.42px	1px = 2.34px
iphone 6	375	1rpx = 0.5px	1px = 2rpx
iphone6plus	414	1rpx = 0.552px	1px = 1.181px

物理像素：指屏幕上实际有多少像素

逻辑像素：是指CSS中使用的像素单位

rpx单位规定了任何手机屏幕的宽度都为750rx(逻辑像素)

目标：为了方便开发人员适配各种手机屏幕

页面级配置文件

属性	说明
navigationBarBackgroundColor	导航栏背景颜色，默认为“#000000”
navigationBarTextStyle	导航栏标题颜色，仅支持black、white（默认）
navigationBarTitleText	导航栏的标题文字内容
backgroundColor	窗口的背景色，默认为"#ffffff"
backgroundTextStyle	下拉loading的样式，仅支持dark(默认)、light
enablePullDownRefresh	是否全局开启下拉刷新，默认为false
onReachBottomDistance	页面上拉触底时间触发时距页面底部距离（单位为px）,默认为50
disableScroll	默认为false.设置true,页面整体不能上下滚动

关注我，后续会继续补充，带你轻松了解微信小程序的开发