分类 react 下的文章

本篇,只在umi项目非常熟练的情况下,如不清楚,可去umi官方文档了解。

一,需求:

1号地址:http://abc.abc.com/aaa
众所周知umi项目要部署在非根目录下,配置base必须为某个目录,即base:'/aaa/'
进入项目后,路由会自动以‘/aaa’为前缀,跳转正常,
例如:
(1)点击‘关于我们’,会路由到http://abc.abc.com/aaa/about





- 阅读剩余部分 -

书写此篇,主要针对您的项目是create-react-app搭建的(未eject配置的),并且用的antd-design UI库还是2.x版本之前的,本篇也许对你有极大帮助。
此时的antd已经是3.9.1版本了,早早的已经是3.x以上了,也不存在上述问题,那么您可以忽略此篇了!


- 阅读剩余部分 -

目前的项目架构,大家都能看到,有路由跳转的地方都是写死的url,如<Link to={'/aaa'}>,push({pathname:'/login'}),这种方式呢,没有问题,但是这样写死不太好,不便于后期维护,
比如以后要改下路径,除了config.js中需要改一次,代码全篇幅都需要改一次,好累;name该怎么办呢?以下我们就来处理一下路由的优化!

优化思路:


- 阅读剩余部分 -

接上一篇:http://blog.ixiewei.com/index.php/archives/205.html

项目配置到这里之后,接下来就需要处理以下配置了:
1 国际化
2 store的数据存储结构

国际化和store数据结构的设计:

此处采用immutable数据格式(immutable一款很棒的数据操作工具,此处不做详解,有兴趣的同学可自行学习),把数据存于model,同样国际化的判断参数定为: i18n 存于app的model中,取值来源于浏览器的本地缓存localStorage用户若设置了某种语言,则存在这里,用户下次访问系统,也依然能唤起上次所选中的语言,当初次访问时,语言默认先取自浏览器,若依然取不到则默认咱们的中文。



- 阅读剩余部分 -

思索良久,决定还是记录下心得体会:一个基于create-react-app官方脚手架,搭建起来的dva开发模式的react项目。

当然现今的前端市场如此强大,你可以在网络上找到你想要的任何脚手架,并且很多可以开箱即用,不可否认它们很优秀,开发它们的人或团队更值得我们竖起大拇指,为他们点赞!比较适合国人还是阿里系的一套react开发脚手架,dva-cliantdUmi等,当然gitHub上也有诸多优秀的脚手架,有兴趣的同学可以自行查阅学习。

这里,仅仅以react官方脚手架开启项目,安装采用dva方式的,构建项目,展示记录过程中遇到的各种点和Keng,若你也遇到类似问题,也许能帮上你。

- 阅读剩余部分 -