2018 年 4月随笔档案 - cag2050

dependencies、devDependencies、webpack打包的区别与联系

摘要：为什么要在dependencies、devDependencies中声明依赖？答：保证任何人在（或者你自己在其他设备上）对这个项目进行修改（开发）时，通过npm install就能获取同样的开发环境。 dependencies、devDependencies 的区别？与webpack打包的联系？阅读全文

posted @ 2018-04-26 12:19 cag2050 阅读(4455) 评论(0) 推荐(0) 编辑

react-router v4 实现路由拦截的一种思路（待验证）

摘要：出处：https://segmentfault.com/q/1010000010905474 阅读全文

posted @ 2018-04-23 11:15 cag2050 阅读(431) 评论(0) 推荐(0) 编辑

create-react-app 搭建的项目中，使用 stylus

摘要：相关介绍文章： 1. react学习系列1 修改create react app配置支持stylus：https://www.jianshu.com/p/9cd7a0dff11f 1. 在react中使用stylus loader：https://z 950.github.io/2018/04/03 阅读全文

posted @ 2018-04-20 11:08 cag2050 阅读(1080) 评论(0) 推荐(0) 编辑

antd 知识点

摘要：表格实现：不管多少列，为列指定一个宽度，让表格在容器里可左右拖动例子文件地址：https://github.com/cag2050/antd_mobx_demo/blob/master/src/components/tableDemo/TableDemo.js 上传组件的上传文件列表，无法通过程序阅读全文

posted @ 2018-04-20 10:15 cag2050 阅读(169) 评论(0) 推荐(0) 编辑

webpack 图片没打包成功

摘要：webpack 图片打包： 1. 直接src引用的，webpack不会进行打包 2. 作为背景图片的，打包成功了解决（react 写法）： 1、import 方法（推荐）： 2、require 方法：本地文件阅读全文

posted @ 2018-04-18 20:57 cag2050 阅读(337) 评论(0) 推荐(0) 编辑

toString() 和 toLocaleString() 的区别

摘要：toString() 和 toLocaleString() 的区别 table th:nth of type(4) { width: 400px; } 区别项 | toString() | toLocaleString() | 结论 | | | new Date() 调用 | Tue Apr 17 阅读全文

posted @ 2018-04-17 12:24 cag2050 阅读(192) 评论(0) 推荐(0) 编辑

使用 localeCompare 函数对中文进行排序

摘要：localeCompare 函数可对中文进行排序。性能相关当比较大量字符串时，比如比较大量数组时，最好创建一个Intl.Collator 对象并使用compare 属性所提供的函数。 mdn介绍：https://developer.mozilla.org/zh CN/docs/Web/Jav 阅读全文

posted @ 2018-04-17 12:22 cag2050 阅读(715) 评论(0) 推荐(0) 编辑

React 使用 PropTypes 进行类型检查

摘要：注意: React.PropTypes 自 React v15.5 起已弃用。请使用 prop types 库代替。 defaultProps 用来确保 this.props.name 在父组件没有特别指定的情况下，有一个初始值。类型检查发生在 defaultProps 赋值之后，所以类型检查也会应阅读全文

posted @ 2018-04-16 15:06 cag2050 阅读(700) 评论(0) 推荐(0) 编辑

react 知识点2

摘要：从 render 函数可以看出来，组件内部是通过 this.props 的方式获取到组件的参数的，如果 this.props 里面有需要的属性我们就采用相应的属性，没有的话就用默认的属性。那么怎么把 props 传进去呢？在使用一个组件的时候，可以把参数放在标签的属性当中，所有的属性都会作为 pr 阅读全文

posted @ 2018-04-13 17:42 cag2050 阅读(99) 评论(0) 推荐(0) 编辑

SPA项目中，404页面和登陆页面对应的路由，应该怎样控制？

摘要：SPA项目中，404页面和登陆页面对应的路由，应该怎样控制？可以这样做: 1. 登陆之前，所有页面跳到登陆页面；包括随便输入的路由地址。 2. 登陆后，跳到相应页面；随便输入的、不存在的路由地址，才跳到404页面。 react项目代码示例： 1. 路由是login或其他： https:// 阅读全文

posted @ 2018-04-13 17:02 cag2050 阅读(271) 评论(0) 推荐(0) 编辑

vue监听路由变化

摘要：使用 watch，观察路由，一旦发生变化便重新获取数据阅读全文

posted @ 2018-04-13 12:04 cag2050 阅读(183) 评论(0) 推荐(0) 编辑

js 去掉前后空格（正则表达式方法）

摘要：代码：阅读全文

posted @ 2018-04-12 16:59 cag2050 阅读(448) 评论(0) 推荐(0) 编辑

react：路由登陆后才能访问的控制

摘要：react router 通过创建一个需要认证的路由来限制登陆后才能访问。官方例子：https://reacttraining.com/react router/web/example/auth workflow 我自己做的例子：https://github.com/cag2050/react 阅读全文

posted @ 2018-04-12 16:19 cag2050 阅读(429) 评论(0) 推荐(0) 编辑

高阶组件 Higher-order Components (HOC) 知识点

摘要：官方介绍地址：https://reactjs.org/docs/higher order components.html 阅读全文

posted @ 2018-04-12 15:50 cag2050 阅读(156) 评论(0) 推荐(0) 编辑

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

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

posted @ 2018-04-11 18:00 cag2050 阅读(2280) 评论(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 阅读(514) 评论(0) 推荐(0) 编辑

eslint 知识点

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

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

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

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

posted @ 2018-04-08 16:56 cag2050 阅读(684) 评论(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 阅读(5525) 评论(0) 推荐(0) 编辑

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

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

posted @ 2018-04-04 10:11 cag2050 阅读(2390) 评论(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 阅读(217) 评论(0) 推荐(0) 编辑

react 实现路由按需加载

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

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

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

posted @ 2018-04-02 21:15 cag2050 阅读(1423) 评论(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 阅读(287) 评论(0) 推荐(0) 编辑

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

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

山水一程

04 2018 档案