本文共 1370 字，大约阅读时间需要 4 分钟。

创建项目

1. 打开HBuilderX -> 新建 uniapp 项目;

2. 创建页面 

|_ index.vue 入口页面

|_ write.vue 文章撰写页面

|_ my.vue 账户中心页面

完善底部导航栏

1. 下载图标, 图标地址：

2. 将图标部署至 /static 目录

3. 修改 page.json

"tabBar" : {        "color" : "#707070",        "selectedColor" : "#DE533A",        "list" : [            {                "pagePath" : "pages/index/index",                "text" : "文章",                "iconPath" : "static/nav1.png",                "selectedIconPath" : "static/nav1-a.png"            },            {                "pagePath" : "pages/write/write",                "text" : "写作",                "iconPath" : "static/nav2.png",                "selectedIconPath" : "static/nav2-a.png"            },            {                "pagePath" : "pages/my/my",                "text" : "我的",                "iconPath" : "static/nav3.png",                "selectedIconPath" : "static/nav3-a.png"            }        ]    }

4. 修改项目名称

"globalStyle" : {    "navigationBarTextStyle" : "black",    "navigationBarTitleText" : "悦读",    "navigationBarBackgroundColor" : "#F8F8F8",    "backgroundColor" : "#F8F8F8"}

加载 graceUI 框架

graceUI : 

|_ 项目根目录

    |_ graceUI

        |_ graceUI.css

在app.vue 内添加以下代码：

后端介绍

本教程将以 php + MySQL 为后端环境，为大家详细讲解服务端代码编写！

转载地址：https://lux-sun.blog.csdn.net/article/details/87875309 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！