在app.json的pages中写上本身的页面路径
四、页面路由
一、不像react、vue那样须要单独的路由,小程序已经帮我们集成了路由,依赖<navigator url=‘’></navigator> 进行页面跳转,js端也可用 wx.navigateTo({url:'',success:''})、wx.redirectTo(url:'',success:'');进行跳转
注意二者区别,前者在新页面打开(小程序只容许最多打开5层),后者则是覆盖以前的页面。
二、对于全局的数据、页面的公共逻辑判断(如进入页面时的权限验证、登陆判断),则能够卸载app.js中,其余页面中能够经过app.xxx方法获取
五、事件
事件写法相似于vue和react组件的事件
绑定事件用:bindtap、binglongtap
阻止事件冒泡用:catchtap
六、支持import和include
<include src="header.wxml"/>
<view>body</view>
<include src="footer.wxml"/>
import是导入模板的
好比定义了一个模板
<!-- item.wxml -->
<template name="item">
<text>{{text}}</text>
</template>
在index.wxml中引用
<import src="item.wxml"/>
<template is="item" data={{text:'foobar'}}/>
3、开发中遇到的问题
一、 经测试没法导入第三方css,机制受到限制
二、css 只能使用线上图片或者base64,没法使用本地图片(由于小程序有1兆的体积限制),除非是用image组件(此处image已经被小程序重写成了自定义组件而非原来的组件)
三、每一个页面的XXX.js不能为空,不然下面会出现 1. Forgot to add page route in app.json. 2. Invoking Page() in async task. 的错误
4、如下是本人总结的官方样例,在开发者工具中打开便可运行,样例代码在官方基础上稍做改动,若是对你有帮助请点star
github地址:
https://github.com/gitwujiaolong/xiaochengxu_demo.git
样例图:
5、不重复造轮子之weui for小程序react
https://github.com/weui/weui-wxss.git