这是教程,也不是教程。
可以先看Demo的操作动图,看看是个什么玩意儿,GitHub地址( )
wxss:
.btnGroup { display: flex; flex-direction: row; flex:1; width:100%; background-color:#fff;}.item { width:25%; display: flex; align-items: center; flex-direction: column; justify-content: center; margin-top:1px; margin-right:1px;}.item:active { background-color:#ff0000;}
css就没什么好说的了,唯一需要注意的是微信提供了一个尺寸单位rpx,responsive pixel ,可以根据屏幕宽度进行自适应,官网文档有详细解析。我在计算器的history页面也有使用:
注意事项
每新建一个页面一定要记得去app.josn的pages属性中添加,不然的话使用navigateTo跳转到新页面后新页面的onLoad方法不会执行。
微信小程序中没有window等JavaScript对象,所以在写JS前想好替代方案,比如本计算器就被坑大了,本来使用eval函数可以方便的计算表达式,结果没法用,绕了好大的弯。
微信小程序中的JS并不是真正的JS,wxss也并不是真正的CSS,所以写的时候还是要注意一下。
本计算器存在不完善和bug,因为重点不是实现全部功能,而是搞清楚微信小程序开发方法,所以非关注点不用在意。
更多剖析简易计算器带你入门微信小程序开发 相关文章请关注PHP中文网!