react ant design路由配置
最初的时候,只使用了antd中的menu,header和footer都是自己写的组件,在写路由时,总是报如下错误:

相关的路由配置如下:

在网上查的说是组件未暴露出去或者是return 这一行必须有个括号或者标签,我检查了我自己的代码,以上两项都没有问题。不知道改如何解决这个问题。
于是采用antd的layout布局,直接在webpack的入口文件的位置,配置相关的路由即可,如下:

但这样的话就把所有的路由写到了一个文件里,感觉很复杂,而且在这个文件里还要写头部的一些配置和布局,还要引入其他的组件,很繁琐。
最好是可以将路由配置写成一个模块再引入,下一次需要配置时直接在模块中修改添加即可,但是具体应该如何写这个模块,暂未在网上找到相关的教学资料,待以后再优化。
YYC]C4.png)
react ant design路由配置的更多相关文章
- React + Ant Design网页,配置
第一个React + Ant Design网页(一.配置+编写主页) 引用博主的另外一篇VUE2.0+ElementUI教程, 请移步: https://blog.csdn.net/u0129070 ...
- React+Ant Design设置左侧菜单导航路由的显示与隐藏(与权限无关)
最近在学习react时,用到了很流行的UI框架Ant Design,也了解了一下Ant Design Pro,发现它们都有导航组件,Ant Design框架的导航菜单在这里,Ant Design Pr ...
- 【React自制全家桶】一、Webstrom+React+Ant Design+echarts搭建react项目
前言 一.React是Facebook推出的一个前端框架,之前被用于著名的社交媒体Instagram中,后来由于取得了不错的反响,于是Facebook决定将其开源.出身名门的React也不负众望,成功 ...
- (二)React Ant Design Pro + .Net5 WebApi:前端环境搭建
首先,你需要先装一个Nodejs,这是基础哦.如果没有这方面知识的小伙伴可以在园子里搜索cnpm yarn等关键字,内容繁多,此不赘述,参考链接 一. 简介 1. Ant Design Pro v5 ...
- react中的路由配置踩坑记
react 路由配置中,如果根路由(/)匹配一个组件,另一个路由(/list)在进行匹配的时候也会匹配到根路由(/),即在 /list 页面展示的时候 / 页面总是展示在上方. 此时如果想进行严格匹配 ...
- React / Ant Design Pro 实现Canvas画布实时自适应
如何实现canvas根据父容器进行自适应? Ant Design的组件都提供了强大的自适应能力,为了对齐父组件,镶嵌在Ant Design组件里的canvas也需要能根据父级容器进行自适应的能力,页面 ...
- (九)React Ant Design Pro + .Net5 WebApi:后端环境搭建-IdentityServer4-简单配置
一.简介 IdentityServer4 是用于 ASP.NET Core 的 OpenID Connect 和 OAuth 2.0 框架,通过中间件的方式集成.JWT(json web token) ...
- 采用React+Ant Design组件化开发前端界面(一)
react-start 基础知识 1.使用脚手架创建项目并启动 1.1 安装脚手架: npm install -g create-react-app 1.2 使用脚手架创建项目: create ...
- react+ant design Breadcrumb面包屑组件
import React from 'react'; import { Link }from 'react-router-dom'; import { Breadcrumb } from 'antd' ...
随机推荐
- hdu 4300 Clairewd’s message(kmp/扩展kmp)
题意:真难懂.. 给出26个英文字母的加密表,明文中的'a'会转为加密表中的第一个字母,'b'转为第二个,...依次类推. 然后第二行是一个字符串(str1),形式是密文+明文,其中密文一定完整,而明 ...
- ss连接不上
突然ss就连接不上了,而vps的ip能ping通,ssh也能登录. 折腾了半天都没解决. 后来解决了,关键点有两个 (1)更改ss的服务端口,原本是9000,随便改为其他的: (2)在switch里设 ...
- java面试题基础
hashMap原理 hashMap是数组+链表的数据结构 每一个数组元素中都是一个链表 通过记录的关键字key.hashCode()%数组的长度 来决定记录在数组中的存储位置 对于数组的同一个存储位置 ...
- Java泛型和反射总结
A a = (A)Class.forName(“pacage.A”).newInstance(); 这和你 A a = new A(): 是一样的效果. String className = “Exa ...
- 【POJ 3468】 A Simple Problem with Integers
[题目链接] 点击打开链接 [算法] 本题用线段树很容易写,但是,笔者为了练习树状数组,就用树状数组的方法做了一遍 我们不妨引入差分数组c, 则sum(n) = c[1] + (c[1] + c[2] ...
- HBase源码分析:HTable put过程
HBase版本:0.94.15-cdh4.7.0 在 HBase中,大部分的操作都是在RegionServer完成的,Client端想要插入.删除.查询数据都需要先找到相应的 RegionServer ...
- UVa11077
dp+置换 可以把排列分成几个循环,然后dp统计 dp[i][j]=dp[i-1][j-1]*(i-1)+dp[i-1][j],表示当前有i个元素,至少换j次,然后如果不在自己应该在的位置有i-1种情 ...
- python学习笔记2-条件语句
#条件语句 ''' if 判断条件: 执行语句…… else: 执行语句…… ''' flag = False name = 'python' if name == 'python': # 判断变量否 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 13. 安装前端库
前端库使用npm进行安装,需要先建立webpack.json文件 因为我们没有使用npm安装任何库,所以npm的文件夹是空的 这里是用于开发时构建时引用的库写在这里 这里用到bootStrap 开发时 ...
- 任务12:Bind读取配置到C#实例
将json文件的配置转换成C#的实体 新建项目: Normal 0 7.8 磅 0 2 false false false EN-US ZH-CN X-NONE /* Style Definition ...