新建布局,注意格式: src/common/nav.js 中增加

  1. {
  2. component: dynamicWrapper(app, [], () => import('/path/to/NewLayout')), // 新建的模板,使用`dynamic`动态引入
  3. layout: 'NewLayout', // 标记,生成路由时会用到
  4. children: [{
  5. name: '新布局', // 新布局下的页面都可以放到这里
  6. icon: 'new',        //小图标
  7. path: 'new',        //这里是routes(业务页面入口和常用模板)下的目录
  8. children: [
        //新的页面
        {
  9.   name: '新页面',
  10.   path: 'new-page',  //小图标
  11.   component: dynamicWrapper(app, ['NewPageModel'], () => import('/path/to/NewPage')),
  12.   }
      ],
  13. }],
  14. }

新建页面:src/routes 下新建 NewPage.js NewPage.less

  1. {
  2. name: '测试一下',
  3. path: 'new',
  4. component: dynamicWrapper(app, ['list'], () => import('../routes/New/NewPage')),
  5. },

如果需要用到 数据流,还需要在 src/models    src/services   中建立相应的 model 和 service

Ant Design Pro 学习二 新建菜单-布局的更多相关文章

  1. Ant Design Pro 学习三 新建组件

    在 src/components 下新建一个以组件名命名的文件夹,注意首字母大写 在使用组件时,默认会在 index.js 中寻找 export 的对象,如果你的组件比较复杂,可以分为多个文件,最后在 ...

  2. ant design pro(二)布局

    一.概述 参看地址:https://pro.ant.design/docs/layout-cn 其实在上述地址ant-design上已经有详细介绍,本文知识简述概要. 页面整体布局是一个产品最外层的框 ...

  3. Ant Design Pro 学习笔记:数据流向

    在讲这个问题之前,有一个问题应当讲一下: Ant Design Pro / umi / dva 是什么关系? 首先是 umi / dva 的关系. umi 是一个基于路由的 react 开发框架. d ...

  4. Ant Design Pro 学习一 安装

    安装: 直接 clone git 仓库 $ git clone --depth=1 https://github.com/ant-design/ant-design-pro.git my-projec ...

  5. ant design pro (三)路由和菜单

    一.概述 参看地址:https://pro.ant.design/docs/router-and-nav-cn 二.原文摘要 路由和菜单是组织起一个应用的关键骨架,我们的脚手架提供了一些基本的工具及模 ...

  6. 【后台管理系统】—— Ant Design Pro入门学习&项目实践笔记(三)

    前言:前一篇记录了[后台管理系统]目前进展开发中遇到的一些应用点,这一篇会梳理一些自己学习Ant Design Pro源码的功能点.附:Ant Design Pro 在线预览地址. Dashboard ...

  7. (二)React Ant Design Pro + .Net5 WebApi:前端环境搭建

    首先,你需要先装一个Nodejs,这是基础哦.如果没有这方面知识的小伙伴可以在园子里搜索cnpm yarn等关键字,内容繁多,此不赘述,参考链接 一. 简介 1. Ant Design Pro v5 ...

  8. ant design pro (十二)advanced UI 测试

    一.概述 原文地址:https://pro.ant.design/docs/ui-test-cn UI 测试是项目研发流程中的重要一环,有效的测试用例可以梳理业务需求,保证研发的质量和进度,让工程师可 ...

  9. ant design pro(一)安装、目录结构、项目加载启动【原始、以及idea开发】

    一.概述 1.1.脚手架概念 编程领域中的“脚手架(Scaffolding)”指的是能够快速搭建项目“骨架”的一类工具.例如大多数的React项目都有src,public,webpack配置文件等等, ...

随机推荐

  1. linux服务器解压缩文件的命令

    尝试去好好用linux.新手起步.   这边只会提到我用过的.其他相关的以后我用到了我会补充的.如果有错欢迎指正 注:1.c-创建-create 2.v-复杂输出    3.f-文件-file     ...

  2. google C++编程风格指南之头文件的包括顺序

    google C++编程风格对头文件的包括顺序作出例如以下指示: (1)为了加强可读性和避免隐含依赖,应使用以下的顺序:C标准库.C++标准库.其他库的头文件.你自己project的头文件.只是这里最 ...

  3. C++技术问题总结-第8篇 STL内存池是怎么实现的

    STL内存池机制,使用双层级配置器.第一级採用malloc.free,第二级视情况採用不同策略. 这样的机制从heap中要空间,能够解决内存碎片问题. 1.内存申请流程图     简要流程图例如以下. ...

  4. 01_GIT基础、安装

     1 为什么选择GIT 分布式,强调个体 公共server压力和数据量都不会太大 速度快.灵活 随意两个开发人员之间能够非常easy的解决冲突 离线工作 每日工作备份 能够吃懊悔药 2  GIT基 ...

  5. 使用javascript正则表达式实现遍历html字符串

    最近在尝试实现一个js模板引擎,其中涉及到使用js解析html字符串的功能.由于我实现的这个模板不止是要能替换参数输出html字符串,还要可以解析出每个dom元素的名称及参数啥的. 网上找到了一个叫做 ...

  6. Intellijidea建javaWeb以及Servlet简单实现

    一.创建并设置javaweb工程1.创建javaweb工程File --> New --> Project... 点击Project后出现如下界面,选择Java Enterprise,选中 ...

  7. CentOS6.9下安装rabbitmq消息队列

    安装如下步骤: 首先安装erlang yum install erlang 安装rabbitmq rpm包 wget http://www.rabbitmq.com/releases/rabbitmq ...

  8. C# 杂活

    1 下拉框 List<Model.Sys.AccountModel> AcModel = BLL.Sys.AccountBLL.Instance.GetModelList("Ro ...

  9. Python 3.6.3 利用 Dlib 19.7 和 opencv 实现人脸68点定位 进行人脸识别

    0.引言 介绍利用Dlib官方给的人脸识别预测器"shape_predictor_68_face_landmarks.dat"进行68点标定,利用OpenCv进行图像化处理,在人脸 ...

  10. 【python】字符串、列表、元组间相互转化及函数len、max、min、sum、sorted、reversed、enumerate、zip用法示例