![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
watts_j
体验技术
展开
-
React 地址记录搜索条件
我们在完成搜索的需求时经常会遇到需要记录搜索条件的需求,一般是利用地址拼接搜索条件的方法核心:切换搜索条件,把条件写入路由,然后监听路由的变化,发送搜索事件接下来记录一个React示例:1. 打开一个页面:使用路由监听,去触发写好的搜索请求export default modelExtend(pageModel, { namespace: 'systemMessage...原创 2019-03-02 16:58:26 · 855 阅读 · 0 评论 -
react antd + node egg实现图片上传并保存在本地文件夹,file和stream
先上egg-multipart的配置 config.multipart = { mode: 'stream', fileModeMatch: /^\/uploadFile$/,// uploadFile接口使用file模式,其他使用stream模式 tmpdir: path.join(os.tmpdir(), 'egg-multipart-tmp', appI...原创 2019-07-11 16:00:28 · 3339 阅读 · 1 评论 -
react-router-breadcrumbs-hoc的应用
从umi文档中看到的这个推荐使用面包屑插件,体验不错,记录一下使用。直接上代码,可以作为一个组件加在任何地方,具体使用看文档---点这里import style from './bc.scss'import withBreadcrumbs from 'react-router-breadcrumbs-hoc';import Link from 'umi/link';const D...原创 2019-06-15 21:06:32 · 2339 阅读 · 5 评论 -
集成dva和react native和react-navigation
先初始化一个react native的项目npm install -g yarn react-native-clireact-native init AwesomeProject准备安装dva 、react-navigation1.yarn add dva-core2.yarn addreact-redux3.yarn add react-navigation4.y...原创 2019-05-29 19:17:26 · 3092 阅读 · 1 评论 -
Electron在react中的进程间的通信
在react中使用electronconst {remote, ipcRenderer} = window.require('electron')// 调用此js文件,引入需要的实例等export { remote, ipcRenderer}ipcMain从主进程到渲染进程的异步通信。1.同步 、通过returnValue将此设置为在一个同步消息中返...原创 2019-05-20 09:49:54 · 2494 阅读 · 0 评论 -
后台管理系统--前端解决思路
陆陆续续的也写过一些后台管理系统,有团队合作的,也有自己负责的以下就整理一些自己的心得,文中有vue和react的用例。首先,拿到一个类似后台管理系统的项目的时候,先明确大概的功能的需求(可能也会有比较坑的时候是那种领导想到啥就加啥的情况),例如:国际化、权限系统...ok,直接来...1. 分层管理系统一般可以划分为三层:菜单栏 账户信息,以及其他被认为是整个系统层级...原创 2019-04-23 18:52:40 · 5044 阅读 · 0 评论 -
react umi当中layout布局切换:登录页、登录之后的布局
1.切换layout布局2.记录从哪个页面跳转到登录页面的,登录之后返回(不使用localStorage)3.Cookie等信息记录登录状态(登录失效,跳到登录页面)核心观点是:将是否登录的状态划分为2种布局 布局1:非登录状态,直接进入登录页面 布局2:已登录状态,拥有sider、header...原创 2019-04-23 13:55:29 · 13761 阅读 · 0 评论 -
dva创建项目,引入less或sass失效问题
以sass为例: 加入sass node-sass sass-loader三个包即可npm installsass node-sass sass-loader --save然后就可以直接使用了import styles from './IndexPage.scss'className={styles.abc}...原创 2019-04-26 10:22:21 · 1310 阅读 · 0 评论 -
理解react中经常使用的withRouter
1.为啥使用它?非路由级组件,例如:公共组件...然后在这样的组件当中不能通过this.props拿取history、location、match等信息的2.写法(1)引入 (2)用withRouter()包裹组件(高阶组件嘛)3.withRouter是如何更新的Important NotewithRouter does not subscribe to locati...原创 2019-03-26 17:26:17 · 1937 阅读 · 0 评论 -
react 详情页的处理,地址记录条件,搭配路由完成
我们经常通过一个地址打开一个详情的页面,比如:商品详情、交易详情通常是GET请求,然后地址后面衔接了特定的条件字段,如:问号之后则是我们需要的信息,如何只需要某一个字段,比如:id...我们也可以这样:这个874是id的值。然后是react当中如何实现,思路大体如下:对system/message/:id 这个动态的路由进行监听进入监听,则获取到id,然后组装请...原创 2019-03-07 14:17:56 · 863 阅读 · 0 评论 -
React umi 通过路由切换完成国际化的处理
理一下自己对于国际化处理的思路:1.拿到用户本机的语言作为第一选项,如果不匹配则设置系统默认的第一语言2.动态路由(已语言为第一层级),用的是umi的约定式路由(其实都差不多)3.以切换路由的方式切换语言,完成页面的国际化(用的插件是: react-intl-universal 阿里出品,优势在于可以在js文件里单独引用)4.切换语言的同时,需要切换ui库的语言(这个有文档岂...原创 2019-03-02 17:42:31 · 3818 阅读 · 0 评论 -
初试next+dva+antd+sass
github地址:https://github.com/wujunwen1997/next-dva-antd1.使用antd初始化项目,使用官方的例子:https://github.com/zeit/next.js/tree/canary/examples/with-ant-designnpx create-next-app --example with-ant-design...原创 2019-07-29 13:22:55 · 1336 阅读 · 0 评论