前端
前端
「已注销」
驻马处皆故里 深巷卖杏花
展开
-
什么是Webpack
什么是webpackwebpack的主要功能就是“打包”,在一个工程中,你的代码可能会有很多js文件、css或者sass样式文件,数量很多且按照你项目的规范放在各个文件目录下——这对开发阶段很友好,我们可以通过清晰的目录结构,来清晰的修改和编写各部分的代码。在项目发布上线时,我们并不需要目录结构多么清晰,反而希望尽量减少很多不必要的代码:例如测试代码等。webpack可以将许多css、sa...转载 2020-01-29 12:52:00 · 468 阅读 · 0 评论 -
React-Loadable-以组件为中心的代码分割和懒加载
author: James Kyle + 荆雷by James Kyle翻译:荆雷Installyarn add react-loadableExampleimport Loadable from 'react-loadable';import Loading from './my-loading-component';const LoadableComponent ...转载 2020-01-29 12:40:47 · 306 阅读 · 0 评论 -
Immutable-js简介
本篇只是对Immutable.js的简单介绍什么是Immutable Data?Immutable data encourages pure functions (data-in, data-out) and lends itself to much simpler application development and enabling techniques from function...转载 2020-01-29 12:11:36 · 313 阅读 · 0 评论 -
React样式管理框架styled-components、动画框架react-transition-group
styled-components1前言前端飞一般的发展中,衍生出各式各样的框架,框架的目的是减轻开发人员的开发难度,提高效率。以前网页开发的原则是关注点分离,意思是各种技术只负责自己的领域,不要混合在一起,形成耦合。如html、css、js代码分离。React的出现,这个原则不在实用,React是组件结构,强制把html、css、js写在一起。如:const style = { ...转载 2019-07-26 09:04:32 · 842 阅读 · 0 评论 -
React状态管理Redux、Redux-Thunk、Redux-Sagas、React-Redux小结
Redux、Redux-Thunk、Redux-Sagas、React-Redux1React环境配置安装脚手架工具$ npm install -g create-react-app创建项目工程// demo是项目名称,不能有大写字母$ create-react-app demo安装浏览器调试工具在FireFox中安装 React Developer Tools 和...转载 2019-07-25 21:41:28 · 275 阅读 · 0 评论 -
Charles 进行前端的本地数据mock
Charles 进行react的本地数据mock第一步:新建一个json文件第二步:下载安装Charles下载地址:https://www.charlesproxy.com/,选择相应的版本下载并且安装安装完成后。点击菜单栏的tools,选择Map Local Settingds,然后Add一个设置Local path指向自己新建的json文件,然后在react里面axios.g...转载 2019-07-21 14:49:51 · 476 阅读 · 0 评论 -
React中的“Ajax”-axios
React中的“ajax”React没有ajax模块集成其他的js库(如axios/fetch/jquery),发送ajax请求axios封装XmlHttpRequest对象的ajaxpromise可以用在浏览器端和服务器fetch不再适用XmlHttpRequest对象提交ajax请求fetch就是用来提交ajax请求的函数,只是新的浏览器才内置了fetch为了兼...转载 2019-07-21 14:08:08 · 122 阅读 · 0 评论 -
Vue/React为什么会出现两个花括号
不论React还是Vue,初学都会遇到类似这样的东西写在DOM中{{item.message}}这两个括号意义不同,可以简单的理解为:外面的花括号是说:我这里面写的是js语句内部的花括号是说:我里面的不是要显示的文字,而是变量,我要把变量的值解析放在这...原创 2020-03-19 17:37:48 · 2533 阅读 · 1 评论 -
npm-install时-save和-save-dev的区别
回顾 npm install 命令1最近在写Node程序的时候,突然对 npm install 的-save和-save-dev 这两个参数的使用比较混乱。其实博主在这之前对这两个参数的理解也是模糊的,各种查资料和实践后对它们之间的异同点略有理解。遂写下这篇文章避免自己忘记,同时也给node猿友一点指引。我们在使用 npm install 安装模块的模块的时候 ,一般会使用下面这几种命令形...转载 2020-01-29 12:48:24 · 554 阅读 · 0 评论 -
为什么React事件处理函数必须使用Function.bind()绑定this
React官网学习Handling Events这一章有如下代码class Toggle extends React.Component { constructor(props) { super(props); this.state = {isToggleOn: true}; // This binding is necessary to make `this` w...转载 2020-01-29 11:57:49 · 205 阅读 · 0 评论 -
React 生命周期 constructor->componentWillMount->render->componentDidMount->componentWillUnmount
React 生命周期 constructor->componentWillMount->render->componentDidMount->componentWillUnmount1<!DOCTYPE html><html><head><meta charset="UTF-8" /><title>R...转载 2019-06-22 23:22:10 · 1013 阅读 · 0 评论