微信小程序开发知识点

主页面跳转子页面的方式

方式一:子页面会被unload，资源被回收，每次重新加载

itemClick:function(){
wx.navigateTo({url:"../logs/logs"})
}

方式二:主页面会被unload，此页面无”返回”按钮

itemClick:function(){
wx.redirectTo({url:"../logs/logs"})
}

页面的传参

wx.navigateTo({url:”../logs/logs?id=1”}),此时的id会被传到log.js的onLoad方法中

<navigator url=”../logs/logs?id=1”/> 或者 <navigator url=”../logs/logs?id=1&title=’标题’” redirect/>

flex布局(display:flex)

flex容器属性的详解（用在container中）

flex-direction：决定元素的排列方向

flex-direction: row | row-reverse | column | column-reverse;

flex-wrap：决定元素如何换行

flex-wrap: nowrap | wrap | wrap-reverse;

flex-flow：flex-direction 和 flex-wrap 的简写

flex-flow: \ || \;

justify-content：元素在主轴的对齐方式

justify-content: flex-start | flex-end | center | space-between | space-around;

align-items：元素在交叉轴的对齐方式

align-items: flex-start | flex-end | center | baseline | stretch;

align-content属性定义了多根轴线的对齐方式。如果项目只有一根轴线，该属性不起作用

align-content: flex-start | flex-end | center | space-between | space-around | stretch;

flex元素属性的详解

flex-grow：当有多余空间时，元素的放大比例

flex-grow: <number>; /* default 0 */

flex-shrink：当有多余空间时，元素的缩小比例

flex-shrink: <number>;/* default 1 */

flex-basis:元素在主轴上占据的空间

flex-basis: <length>; | auto; /* default auto */

flex 是grow、shrink、basis的简写

flex: none | [ <’flex-grow’> <’flex-shrink’>? || <’flex-basis’> ]

order 定义元素的排列顺序

order: <integer>;

align-self 定义元素自身的对齐方式

align-self: auto | flex-start | flex-end | center | baseline | stretch;

相对定位和绝对定位的区别(原则：子绝父相)

”相对定位的元素是相对自身进行定位，参照物是自己。”

“绝对定位的元素是相对离它最近的一个一定为的父级元素进行定位”