问题及解决方案汇总--FAQ

[yezihaohao]

项目中遇到的问题和找到的解决方案进行汇总清单~

[hypo1986]

在首页 里 加链接 跳转到页面 左侧菜单不自动 更新展开 这怎么处理？

[chenkangyang]

Redux-alita使用说明

看了一下redux-alita的实现, 稍微写一下自己的理解, 有错误请指正! @SiroSong @hypo1986 使用React-Redux针对此项目进行了封装,

提供4个功能: {AlitaProvider, connectAlita, setAlitaState, setConfig}

AlitaProvider

1. 使用 redux-thunk 作为异步action中间件, 生成唯一的一个容器 store,
2. 提供一个包裹在根组件外面的Provider组件, 使所有的子组件都能拿到 store, 它的原理是React组件的context属性

   connectAlita(state)

3. 使用connect方法, 从 "UI组件"(App组件) 生成 "容器组件"
4. 传入参数state, 使用mapStateToProps负责输入逻辑, 即将state映射到 "UI组件"的参数(props), 引起UI组件的更新
5. 使用mapDispatchToProps负责输出逻辑, 即将用户对 "UI组件"的操作映射成 Action, 传给Store存储, 引起state的更新

   setAlitaState(Object)

   Object.funcName: 请求接口函数名称
   Object.stateName: category
   Object.data: data
   Object.params: 请求接口的参数
   之后 dispatch 执行一个 Action, 表示 state 要发生变化

   setConfig (apis)

   传入所有的接口, 存入funcs, 以便使用funcs[funcName](params)执行接口函数

[wdlhao]

master分支，routes/index.js中， return r.login ? wrappedComponent : this.requireLogin(wrappedComponent, r.auth) 这里的r.login没有这个属性，为什么要通过r.login来判断呢？

[yezihaohao]

master分支，routes/index.js中， return r.login ? wrappedComponent : this.requireLogin(wrappedComponent, r.auth) 这里的r.login没有这个属性，为什么要通过r.login来判断呢？

某些不需要登录判断的场景需要，该模板后续会加此功能

[yezihaohao]

问题描述： 如何兼容IE浏览器？ 解决方案： JavaScript Environment Requirements

参考：https://github.com/yezihaohao/react-admin/issues/56 https://github.com/facebook/react/issues/11429 https://facebook.github.io/create-react-app/docs/supported-browsers-features create-react-app开发环境下参考： https://github.com/facebook/create-react-app/issues/5336#issuecomment-442729575 其他：动动小手指Google （ps：react-admin测试IE11，IE10，IE9下都可正常运行）

2019-09-10增加： 最简单的兼容方法（在上面的方案中）： 安装react-app-polyfill（yarn add react-app-polyfill），在src/index.js最顶端引用import 'react-app-polyfill/ie9'; 注意：打包之后没问题，本地开发环境的话需要修改下config/webpack.config.dev.js，注释掉require.resolve('react-dev-utils/webpackHotDevClient')

在IE文档仿真模式下的效果截图（IE9不支持flex样式，所以用到flex的地方需要自己做兼容）

[johngai19]

请问mock的数据格式应该是什么，演示地址和直接安装都连不上mock网站了。能不能自己本地mock一份？

[zzlit]

你好，第一次加载非常慢，好像是因为路由没有进行懒加载？

[SilvesterChiao]

请问： 执行过 npm run eject之后重新npm start报编译错误要怎么处理

[Mirefire]

我的我用create-react-app项目怎么没scripts目录呢

[winnie-weinan]

请问登录后刷新网页又回到登录页。有什么办法可以使得登录后根据token判断刷新后到登录页或只是刷新页面 谢谢👑

[wxzen]

项目start/build失败，recharts报错： ` TypeScript error in D:/Develop/jsspace/study/react-admin/src/components/charts/EchartsEffectScatter.tsx(514,17): No overload matches this call. Overload 1 of 2, '(props: ReactEchartsPropsTypes | Readonly): ReactEcharts', gave the following error. Type '{ backgroundColor: string; title: { text: string; subtext: string; sublink: string; left: string; textStyle: { color: string; }; }; tooltip: { trigger: string; }; legend: { orient: string; y: string; x: string; data: string[]; textStyle: { ...; }; }; geo: { ...; }; series: ({ ...; } | { ...; })[]; }' is not assignable to type 'EChartOption'. The types of 'legend.orient' are incompatible between these types. Type 'string' is not assignable to type '"horizontal" | "vertical" | undefined'. Overload 2 of 2, '(props: ReactEchartsPropsTypes, context: any): ReactEcharts', gave the following error. Type '{ backgroundColor: string; title: { text: string; subtext: string; sublink: string; left: string; textStyle: { color: string; }; }; tooltip: { trigger: string; }; legend: { orient: string; y: string; x: string; data: string[]; textStyle: { ...; }; }; geo: { ...; }; series: ({ ...; } | { ...; })[]; }' is not assignable to type 'EChartOption'. TS2769

512 |         return (
513 |             <ReactEcharts

514 | option={option} | ^ Failed to compile.

`

[TomoGaSukunai]

项目start/build失败，recharts报错： ` TypeScript error in D:/Develop/jsspace/study/react-admin/src/components/charts/EchartsEffectScatter.tsx(514,17): No overload matches this call. Overload 1 of 2, '(props: ReactEchartsPropsTypes | Readonly): ReactEcharts', gave the following error. Type '{ backgroundColor: string; title: { text: string; subtext: string; sublink: string; left: string; textStyle: { color: string; }; }; tooltip: { trigger: string; }; legend: { orient: string; y: string; x: string; data: string[]; textStyle: { ...; }; }; geo: { ...; }; series: ({ ...; } | { ...; })[]; }' is not assignable to type 'EChartOption'. The types of 'legend.orient' are incompatible between these types. Type 'string' is not assignable to type '"horizontal" | "vertical" | undefined'. Overload 2 of 2, '(props: ReactEchartsPropsTypes, context: any): ReactEcharts', gave the following error. Type '{ backgroundColor: string; title: { text: string; subtext: string; sublink: string; left: string; textStyle: { color: string; }; }; tooltip: { trigger: string; }; legend: { orient: string; y: string; x: string; data: string[]; textStyle: { ...; }; }; geo: { ...; }; series: ({ ...; } | { ...; })[]; }' is not assignable to type 'EChartOption'. TS2769

512 |         return (
513 |             <ReactEcharts

514 | option={option} | ^ Failed to compile.

` 我也遇到了 貌似npm i 安装的依赖版本有问题 你看看你的 lock 文件里实际装的 EChart 依赖版本是不是版本和源代码里的 yarn.lock 有出入 我删了 node_modules 重新用 yarn 好了

[leelance]

各位，最新react+ts版本的 图标是怎么处理的 {item.icon && <Icon type={item.icon} />} antd3.x这样是没有问题的？ 4.x怎么解决的？

[jiaxiantao]

项目start/build失败，recharts报错：

No overload matches this call. Overload 1 of 2, '(props: ReactEchartsPropsTypes | Readonly): ReactEcharts', gave the following error. Type '{ tooltip: { trigger: string; position: (pt: any) => any[]; }; title: { left: string; text: string; }; toolbox: { feature: { dataZoom: { yAxisIndex: string; }; restore: {}; saveAsImage: {}; }; }; xAxis: { type: string; boundaryGap: boolean; data: string[]; }; yAxis: { ...; }; dataZoom: ({ ...; } | { ...; })[]; serie...' is not assignable to type 'EChartOption'. Types of property 'xAxis' are incompatible. Type '{ type: string; boundaryGap: boolean; data: string[]; }' is not assignable to type 'XAxis | XAxis[] | undefined'. Type '{ type: string; boundaryGap: boolean; data: string[]; }' is not assignable to type 'XAxis'. Types of property 'type' are incompatible. Type 'string' is not assignable to type '"time" | "value" | "category" | "log" | undefined'. Overload 2 of 2, '(props: ReactEchartsPropsTypes, context: any): ReactEcharts', gave the following error. Type '{ tooltip: { trigger: string; position: (pt: any) => any[]; }; title: { left: string; text: string; }; toolbox: { feature: { dataZoom: { yAxisIndex: string; }; restore: {}; saveAsImage: {}; }; }; xAxis: { type: string; boundaryGap: boolean; data: string[]; }; yAxis: { ...; }; dataZoom: ({ ...; } | { ...; })[]; serie...' is not assignable to type 'EChartOption'. TS2769

103 |         return (
104 |             <ReactEcharts

105 | option={option} | ^ 106 | style={{ height: '300px', width: '100%' }} 107 | className={'react_for_echarts'} 108 | /> 我也遇到了这个问题，我试图删掉node_modules 依赖包，使用yarn 重新安装依赖，依然会有同样的问题。

[tzbcf]

最新的包clone下来，启动不起来呀，修改了后，启动起来了，控制台正常，但是页面却还是一堆报错。有点心累

[102631479]

TypeScript error in C:/Users/Administrator/Desktop/react-admin-master/src/components/charts/EchartsArea.tsx(105,17): No overload matches this call. Overload 1 of 2, '(props: ReactEchartsPropsTypes | Readonly): ReactEcharts', gave the following error. Type '{ tooltip: { trigger: string; position: (pt: any) => any[]; }; title: { left: string; text: string; }; toolbox: { feature: { dataZoom: { yAxisIndex: string; }; restore: {}; saveAsImage: {}; }; }; xAxis: { type: string; boundaryGap: boolean; data: string[]; }; yAxis: { ...; }; dataZoom: ({ ...; } | { ...; })[]; serie...' is not assignable to type 'EChartOption'. Types of property 'xAxis' are incompatible. Type '{ type: string; boundaryGap: boolean; data: string[]; }' is not assignable to type 'XAxis | XAxis[] | undefined'. Type '{ type: string; boundaryGap: boolean; data: string[]; }' is not assignable to type 'XAxis'. Types of property 'type' are incompatible. Type 'string' is not assignable to type '"category" | "value" | "time" | "log" | undefined'. Overload 2 of 2, '(props: ReactEchartsPropsTypes, context: any): ReactEcharts', gave the following error. Type '{ tooltip: { trigger: string; position: (pt: any) => any[]; }; title: { left: string; text: string; }; toolbox: { feature: { dataZoom: { yAxisIndex: string; }; restore: {}; saveAsImage: {}; }; }; xAxis: { type: string; boundaryGap: boolean; data: string[]; }; yAxis: { ...; }; dataZoom: ({ ...; } | { ...; })[]; serie...' is not assignable to type 'EChartOption'. TS2769

103 |         return (
104 |             <ReactEcharts

105 | option={option} | ^ 106 | style={{ height: '300px', width: '100%' }} 107 | className={'react_for_echarts'} 108 | />

[magicsli]

预览的基础动画中的这些似乎有蛮严重的闪烁问题, 点击的时候会闪烁 (bounceInDown, bounceInLeft... )

[TomLYW]

楼主 为啥打包之后登录成功后跳转不到首页去了