cag2050 - 博客园

antd、react-router-dom v4 解决菜单和地址同步问题

摘要：点击不同的菜单，右边内容做相应的变化。不过，对于后退操作和刷新页面操作无效，左边菜单无法保持选中项高亮。解决思路如下：Ｍenu 用 seletedKeys 来决定哪项被选中。需要判断当前选前的路由是什么，可以借助 withRouter。参考：https://zhuanlan.zhihu.co 阅读全文

posted @ 2018-04-11 18:00 cag2050 阅读(2314) 评论(0) 推荐(0)

xlsx 库知识点

摘要：官方github地址：https://github.com/SheetJS/js xlsx xlsx 用webpack打包后体积太大： vue cli构建的项目，优化办法：https://segmentfault.com/a/1190000014284449 阅读全文

posted @ 2018-04-10 14:33 cag2050 阅读(545) 评论(0) 推荐(0)

eslint 知识点

摘要： ESlint和webpack集成，在babel编译代码开始前，进行代码规范检测。 eslint的配置方式。比较多元化： js注释 .eslintrc. 文件 package.json里面配置eslintConfig字段阅读全文

posted @ 2018-04-10 09:48 cag2050 阅读(177) 评论(0) 推荐(0)

bootstrap-table设置表头宽度无效的解决方案

摘要： bootstrap table设置colmuns中某列的宽度无效时，需要给整个表设置css属性: 阅读全文

posted @ 2018-04-08 16:56 cag2050 阅读(733) 评论(0) 推荐(0)

create-react-app：reject和不reject(使用react-app-rewired)这2种情况下的antd组件按需引入配置

摘要： create react app：eject和不eject(使用react app rewired)这2种情况下的antd组件按需引入配置：不eject(使用react app rewired)配置：详细说明：https://ant.design/docs/react/use with crea 阅读全文

posted @ 2018-04-04 16:11 cag2050 阅读(5580) 评论(0) 推荐(0)

高阶组件知识点，什么是高阶组件？

摘要：比较好的介绍文章：标题 | 链接地址 | 深入浅出React高阶组件 | https://segmentfault.com/a/1190000010371752 带着三个问题深入浅出React高阶组件 | https://juejin.im/post/59818a485188255694568ff 阅读全文

posted @ 2018-04-04 10:11 cag2050 阅读(2420) 评论(0) 推荐(0)

react-router 从 v3 版本升到 v4 版本，升级小记

摘要： react router v4 跟 react 一样拆成了两部分，核心的 react router 和依运行环境而定的 react router dom 或 react router native（跟 react dom 和 react native 一样）。本文要说的是浏览器环境，也就是 reac 阅读全文

posted @ 2018-04-04 10:08 cag2050 阅读(259) 评论(0) 推荐(0)

react 实现路由按需加载

摘要： import() 方法： 1. async.js 文件内容： 2. 使用：项目地址：https://github.com/cag2050/react_antd_demo 阅读全文

posted @ 2018-04-03 18:55 cag2050 阅读(509) 评论(0) 推荐(0)

vue-router 与 react-router 设计理念上的区别

posted @ 2018-04-02 21:15 cag2050 阅读(1461) 评论(0) 推荐(0)

create-react-app 知识点

摘要：用 create react app 创建项目时，最好FQ；否则有些安装包会安装不上，报超时错误。 create react app 创建的项目，执行后，按需引入antd的2种方式：出处：https://blog.csdn.net/well2049/article/details/7880122 阅读全文

posted @ 2018-04-01 00:48 cag2050 阅读(306) 评论(0) 推荐(0)

ElementUI（vue UI库）、iView（vue UI库）、ant design（react UI库）中组件的区别

posted @ 2018-04-01 00:24 cag2050 阅读(10462) 评论(0) 推荐(0)

create-react-app 搭建的项目中，让 antd 通过侧边栏导航 Menu 的 Menu.Item 控制 Content 部分的变化

摘要：第一种：BrowserRouter把Menu和Route组给一起包起来 1. `` 标签要把Menu和Route组给一起包起来修改src/index.js文件，相应内容如下： 2. Menu.Item 部分： 3. Route 部分自己做的例子：https://github.com/cag205 阅读全文

posted @ 2018-03-31 17:34 cag2050 阅读(9986) 评论(1) 推荐(1)

react-router v4.0 知识点

摘要： react router 提供了一个withRouter组件 withRouter可以包装任何自定义组件，将react router 的 history,location,match 三个对象传入。介绍文章：https://blog.csdn.net/ISaiSai/article/details 阅读全文

posted @ 2018-03-31 16:31 cag2050 阅读(168) 评论(0) 推荐(0)

prop-types：该第三方库对组件的props中的变量进行类型检测

摘要：利用prop types第三方库对组件的props中的变量进行类型检测阅读全文

posted @ 2018-03-31 13:28 cag2050 阅读(171) 评论(0) 推荐(0)

dva 知识点

摘要： dva中，路由模式从hashHistory换成 browserHistory： dva cli创建的项目中，src/index.js相应部分修改如下： dva 通过 model 的概念把一个领域的模型管理起来，包含同步更新 state 的 reducers，处理异步逻辑的 effects，订阅数据源阅读全文

posted @ 2018-03-31 13:07 cag2050 阅读(248) 评论(0) 推荐(0)

react-redux 知识点

摘要： React Redux 使用 1. 如果只使用redux，那么流程是这样的： component dispatch(action) reducer subscribe getState component 用了react redux之后流程是这样的： component actionCreator( 阅读全文

posted @ 2018-03-31 12:55 cag2050 阅读(196) 评论(0) 推荐(0)

redux 知识点

摘要： redux原理：store中维护了一个state，我们dispatch一个action，接下来reducer根据这个action更新state。 react redux提供两个关键模块：Provider和connect。 connect：就是将store中的必要数据作为props传递给React组件阅读全文

posted @ 2018-03-31 12:53 cag2050 阅读(167) 评论(0) 推荐(0)

roadhog 知识点

摘要： roadhog 是一个 cli 工具，提供 server、 build 和 test 三个命令，分别用于本地调试和构建，并且提供了特别易用的 mock 功能。命令行体验和 create react app 一致，配置略有不同，比如默认开启 css modules，然后还提供了 JSON 格式的配置方阅读全文

posted @ 2018-03-31 12:17 cag2050 阅读(317) 评论(0) 推荐(0)

npx：npm包执行器

摘要： npx 作用： 1. 单次执行命令而不需要安装到本机 1. 执行依赖包里的二进制文件使用不同版本的 node 利用 npx 可以下载模块这个特点，可以指定某个版本的 Node 运行脚本。它的窍门就是使用 npm 的 node 模块。上面命令会使用 0.12.8 版本的 Node 执行脚本。原理是阅读全文

posted @ 2018-03-23 14:22 cag2050 阅读(346) 评论(0) 推荐(0)

react 学习资料

摘要： react 学习资料项目 | 学习资料 | react | 中文版：https://doc.react china.org/ react router | https://reacttraining.com/react router/web/api/location create react ap 阅读全文

posted @ 2018-03-23 11:25 cag2050 阅读(153) 评论(0) 推荐(0)

:nth-of-type(n) 与 :nth-child(n) 区别

摘要： :nth of type(n)：选择器匹配同类型中的第n个同级兄弟元素。 :nth child(n)：选择器匹配父元素中的第n个子元素。阅读全文

posted @ 2018-03-21 11:30 cag2050 阅读(157) 评论(0) 推荐(0)

echarts x轴文字显示不全(xAxis文字倾斜比较全面的3种做法值得推荐)

摘要：出处：http://blog.csdn.net/kebi007/article/details/68488694 阅读全文

posted @ 2018-03-21 11:11 cag2050 阅读(295) 评论(0) 推荐(0)

从输入URL到页面加载的过程？由一道题完善自己的前端知识体系！

摘要：出处：http://mp.weixin.qq.com/s/qMsf4DcMhn2cf0fXC PLVA 强缓存与弱缓存缓存可以简单的划分成两种类型：强缓存（ 200fromcache）与协商缓存（ 304）。区别简述如下： 1. 强缓存（ 200fromcache）时，浏览器如果判断本地缓存阅读全文

posted @ 2018-03-15 23:46 cag2050 阅读(202) 评论(0) 推荐(0)

浏览器多进程架构、浏览器内核多线程、js单线程、GUI 渲染线程与 JavaScript引擎线程互斥原理

摘要：浏览器是多进程的，有一个主控进程，以及每一个tab页面都会新开一个进程（某些情况下多个tab会合并进程）。出处：http://www.imweb.io/topic/58e3bfa845e5c13468f567d5 阅读全文

posted @ 2018-03-15 23:22 cag2050 阅读(625) 评论(0) 推荐(0)

通过script src引入ElementUI时，使用语句：window.ELEMENT.MessageBox.alert(xxx) 调用弹出框

摘要：通过script src引入ElementUI时，使用语句：调用弹出框。阅读全文

posted @ 2018-03-15 17:14 cag2050 阅读(708) 评论(0) 推荐(0)

计算2个日期之间的天数

摘要：注意点：2个日期字符串的时间，不要全写' 00:00:00'；如果全写' 00:00:00'，在某些浏览器下会少算一天。阅读全文

posted @ 2018-03-13 19:32 cag2050 阅读(358) 评论(0) 推荐(0)

js 字符串转对象

摘要：使用eval 阅读全文

posted @ 2018-03-13 16:35 cag2050 阅读(183) 评论(0) 推荐(0)

requestAnimationFrame 知识点

摘要：与setTimeout相比，requestAnimationFrame最大的优势是由系统来决定回调函数的执行时机。具体一点讲，如果屏幕刷新率是60Hz,那么回调函数就每16.7ms被执行一次，如果刷新率是75Hz，那么这个时间间隔就变成了1000/75=13.3ms，换句话说就是，requestAn 阅读全文

posted @ 2018-03-08 22:12 cag2050 阅读(160) 评论(0) 推荐(0)

vue项目权限控制

摘要： Vue权限控制有各种方法，大概分为两个方向： 1. 把当前角色对应的权限保存在浏览器本地（容易被恶意修改）； 2. 将操作权限保存在vuex中（推荐此种方式：页面一刷新就没了，可以再次向后端请求相关数据，始终保持最新的权限）。阅读全文

posted @ 2018-03-08 16:49 cag2050 阅读(359) 评论(0) 推荐(0)

css中权重与继承

摘要：出处：http://blog.csdn.net/xf616510229/article/details/53613212 阅读全文

posted @ 2018-03-05 21:51 cag2050 阅读(135) 评论(0) 推荐(0)

Flex Basis与Width的区别

摘要：出处：https://www.jianshu.com/p/17b1b445ecd4 阅读全文

posted @ 2018-03-05 00:45 cag2050 阅读(243) 评论(0) 推荐(0)

新版vue-cli输入本地ip不能访问，只能用localhost才可以访问？

摘要：问：新版vue cli输入本地ip不能访问，只能用localhost才可以访问？答：修改config/index.js配置，将改为就可以了。用ip、127.0.0.1、localhost均行。阅读全文

posted @ 2018-03-03 18:37 cag2050 阅读(734) 评论(0) 推荐(0)

vue打包报内存溢出

摘要： vue cli 构建的项目： package.json 文件里修改：修改为：阅读全文

posted @ 2018-03-01 20:28 cag2050 阅读(471) 评论(0) 推荐(0)

TypeScript 知识点

摘要： TypeScript 通过类型批注提供静态类型以在编译时启动类型检查。基本批注类型是number、bool、string。而弱或动态类型是any。 typescript 使用作用 | 语句 | 全局安装 | npm install g typescript 查看版本 | tsc v Type 阅读全文

posted @ 2018-02-27 17:03 cag2050 阅读(277) 评论(0) 推荐(0)

css3中的BFC,IFC,GFC和FFC

posted @ 2018-02-27 16:33 cag2050 阅读(347) 评论(0) 推荐(0)

parcel (另一个打包工具)知识点

摘要： ParcelJS 本身是 0 配置的，但 HTML、JS 和 CSS 分别是通过 posthtml、babel 和 postcss 处理的，所以我们得分别配 .posthtmlrc、.babelrc 和 .postcssrc。问题：CSS模块没有起作用解决： 1. 在项目中安装包：postcss 阅读全文

posted @ 2018-02-26 18:37 cag2050 阅读(393) 评论(0) 推荐(0)

GoJS v1.8.12 去掉水印

摘要：找到这段代码，特征：1. 含有字符串：'7eba17a4ca3b1a8346','78a118b7'；2. 也可能不为aw，根据具体情况来操作。在上面代码之后，添加如下代码：也可以从此处下载：http://download.csdn.net/download/cag/10247755 阅读全文

posted @ 2018-02-09 18:49 cag2050 阅读(985) 评论(0) 推荐(0)

webstorm版本2017.2开发stylus报错

摘要： style 部分声明的时候，要有lang和type属性。前提是，已经npm安装了stylus，stylus loader。阅读全文

posted @ 2018-02-09 17:03 cag2050 阅读(298) 评论(0) 推荐(0)

将 vue 挂在 window 对象上，实现能调用 elementUI 的组件

摘要： html 部分： js 部分(将js代码放在 body 的 onload事件中： ``)：阅读全文

posted @ 2018-02-06 21:25 cag2050 阅读(2041) 评论(0) 推荐(0)

jQuery的ready()事件与js中的onload事件的区别

摘要：出处：http://blog.csdn.net/yuanmei1986/article/details/50781453 阅读全文

posted @ 2018-02-06 20:10 cag2050 阅读(167) 评论(0) 推荐(0)

导航

公告