本书未发布

3.2. 基础页面结构

基本结构

这一节我们来创建 larabbs-weapp 的基本结构。

Tabbar

参考一下一般 APP 或者小程序的设计,例如美团:

file

底部需要有 Tabbar 作为不同功能的主入口,我们首先设计两个 Tabbar 入口,首页我的

增加我的页面

上一节中已经介绍了 WePY 的目录结构,先不用深入理解每个目录,实践当中你会有更深入的理解,首先需要记住的是:

  • 源码都需要放在 src 目录中;
  • src/app.wpy 是项目的入口文件,相关的配置都会放在这个文件中;
  • src/pages 目录中存放小程序的每个页面。

file

项目中已经存在了首页的文件 src/pages/index.wpy,现在我们来创建 我的 页面,并配置 Tabbar:

$ cd ~/Code/larabbs-weapp
$ to...

本文章首发在 LearnKu.com 网站上。

为了保证课程的高品质,我们需要对课程进行收费。付费后 才能观看剩余内容。 购买

上一篇 下一篇
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
讨论数量: 19

Fykex
atom 下 wepy 代码高亮
6 个点赞 | 1 个回复 | 分享 | 课程版本 5.5
wulijieone
你们运行 NPM run eslint 都没有报错吗?
3 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
Carlgao
phpstorm 下 wpy 高亮?
1 个点赞 | 0 个回复 | 问答 | 课程版本 5.5
taodaykiu
本地安装 wepy 失败
0 个点赞 | 6 个回复 | 问答 | 课程版本 5.5
Innocence6
NPM run eslint 报错?
0 个点赞 | 5 个回复 | 问答 | 课程版本 5.5
Promisehp
选中后没有选中色?
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
Golang
NPM run eslint 报错
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
putixin
Sublime3 下没有插件?
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
dptms
wepy 编译之后 改变文件 貌似没有监听到呢?
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
深入浅出
eslint 做了设置依然有报错
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
jollysone
建立了文件 user.wpy 报错空文件?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
vanman
微信开发工具报错 appLaunch with an already exist webviewId 51
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
phpervip
export default class User extends wepy.page {}什么意思
0 个点赞 | 0 个回复 | 问答 | 课程版本 2.0
phpervip
icon 图标放 src/images 目录下找不到,已解决
0 个点赞 | 0 个回复 | 分享 | 课程版本 2.0
xunxiancoming
微信开发工具退出重进模拟器就不管用了
0 个点赞 | 0 个回复 | 分享 | 课程版本 5.5
Jovi
页面没了
0 个点赞 | 0 个回复 | 问答 | 课程版本 5.5
郝合心
选中按钮的色号
0 个点赞 | 0 个回复 | 分享 | 课程版本 5.5