zoukankan      html  css  js  c++  java
  • 1.项目策划和新建uni-app项目

    1.页面

    1.首页

    banner组件

    公告组件

    章程组件

    加入暗部组件

    用户反馈组件

    用户群组件

    暗部群组件

    商务合作客服邮箱。

    2.社区

    板块列表页面

    各帖子列表页面

    搜索组件

    搜索后帖子列表组件

    帖子页面

    3.宣言

    4.脚本

    5.个人中心

    注册页面

    登录页面

    重置密码页面

    个人中心页面

    2.新建uni-app项目wwab

     1.新建页面

     2.去iconfont下载几个图标

    https://www.iconfont.cn/

    放在wwab的static目录下

    3.在pages.json中配置一下

    pages.json:

    {
        "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
            {
                "path": "pages/index/index",
                "style": {
                    "navigationBarTitleText": "网文暗部 首页"
                }
            }
            ,{
                "path" : "pages/shequ/shequ",
                "style" : {
                    "navigationBarTitleText": "网文暗部 社区"
                }
            }
            ,{
                "path" : "pages/xuanyan/xuanyan",
                "style" : {
                    "navigationBarTitleText": "网文暗部 宣言"
                }
            }
            ,{
                "path" : "pages/jiaoben/jiaoben",
                "style" : {
                    "navigationBarTitleText": "网文暗部 脚本"
                }
            }
            ,{
                "path" : "pages/geren/geren",
                "style" : {
                    "navigationBarTitleText": "网文暗部 个人中心"
                }
            }
            ,{
                "path" : "pages/geren/login/login",
                "style" : {
                    
                }
            }
            ,{
                "path" : "pages/geren/zhuce/zhuce",
                "style" : {
                    
                }
            }
            ,{
                "path" : "pages/geren/forget/forget",
                "style" : {
                    
                }
            }
        ],
        "globalStyle": {
            "navigationBarTextStyle": "white",
            "navigationBarTitleText": "网文暗部",
            "navigationBarBackgroundColor": "black",
            "backgroundColor": "#ffffff"
        },
        
        "tabBar": {
            "color": "#FFFFFF",
            "selectedColor": "#d81e06",
            "borderStyle": "white",
            "backgroundColor": "black",
            "list": [
                {
                "pagePath": "pages/index/index",
                "iconPath": "static/shouye0.png",
                "selectedIconPath": "static/shouye1.png",
                "text": "首页"
            }, 
            {
                "pagePath": "pages/shequ/shequ",
                "iconPath": "static/shequ0.png",
                "selectedIconPath": "static/shequ1.png",
                "text": "社区"
            },
            {
                "pagePath": "pages/xuanyan/xuanyan",
                "iconPath": "static/xuanyan0.png",
                "selectedIconPath": "static/xuanyan1.png",
                "text": "宣言"
            },
            {
                "pagePath": "pages/jiaoben/jiaoben",
                "iconPath": "static/jiaoben0.png",
                "selectedIconPath": "static/jiaoben1.png",
                "text": "脚本"
            },
            {
                "pagePath": "pages/geren/geren",
                "iconPath": "static/geren0.png",
                "selectedIconPath": "static/geren1.png",
                "text": "个人中心"
            }
            ]
        }
    }

    在浏览器内运行项目效果:

    画风有点阴间滤镜的感觉了,没办法,美术功底实在有待提高,为了贴合“暗部”,只能搞成这样。

  • 相关阅读:
    Form组件
    LAMP+Varnish的实现
    缓存反向代理-Varnish
    CDN初识
    HTTP缓存初探
    Keepalived搭建主从架构、主主架构实例
    实现高可用-Keepalived
    nginx负载均衡实例
    lvs集群实现lvs-dr模型和lvs-nat模型
    LVS介绍
  • 原文地址:https://www.cnblogs.com/xuepangzi/p/14919286.html
Copyright © 2011-2022 走看看