微信小程序
Posted Sil
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信小程序相关的知识,希望对你有一定的参考价值。
应用弹性盒子布局
基于 flexbox layout 的实现
先变为 flexbox layout
display: flex;
从上往下
flex-direction: column;
均匀分布,居中
justify-content: space-around;
//居中
align-items: center;
-----------------------------------------------------------------------------------
响应式长度单位rpx
如何让元素大小适配不同宽度屏幕
小程序规定所有设备的屏幕宽高均位750rpx
苹果6屏幕 px:rpx = 1:2
--------------------------------------------------------------------------------------
公共样式表 app.wxss
写全局 wxss
外置weekly页的标题
{
"navigationBarTitleText":"每周推荐"
}
---------------------------------------------------------------------
使用 navigator 组件
<navigator style="display:inline;" url="...">链接</navigator> <!-- style="display:inline;" 可疑元素??? -->
open-type 属性
open-type=‘redirect‘ <!-- 重定向,不返回 -->
hover-class 属性,级使用时注意之处
后定义的会渗出,要注意定义的排序(一个坑)
----------------------------------------------------------------
配置 tabBar
<!-- 用于链接点击,icon也变换的,不然点击链接无法跳转页面 --> open-type=‘seitchTab‘
----------------------------------------------------------------
配置全局的导航栏样式
全局配置 app.json 的"window"属性
<!--app.json--> "window": { "navigationBarBackgroundColor": "#fff", "navigationBarTextStyle": "black" }
-------------------------------------------------------------------
数据绑定-从视图中抽离出数据
基于DOM API手动更新视图的缺点--引入 data binding
pageObject 的注册
pageObject 的 data 属性
运算表达式的数据绑定
使用开发者工具查看和修改页面状态数据
在小程序框架中,每个页面所需要的各种数据,都是集中在这个页面所注册的页面对象中定义的
以上是关于微信小程序的主要内容,如果未能解决你的问题,请参考以下文章