微信小程序开发的页面组件
微信小程序开发的页面组件
| 标签 | 功能 | 标签 | 功能 |
|---|---|---|---|
| 视图容器 | 图标文件 | ||
| | 文本域 | 复选框 | |
| 按钮 | 单选框 | ||
| 图片 | 输入框 | ||
| 表单 | 进度条 |
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,页面整体不能上下滚动 |
关注我，后续会继续补充，带你轻松了解微信小程序的开发
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！