- 博客(18)
- 收藏
- 关注
RSS订阅原创 create-react-app 脚手架同源跨域 配置proxy的方法
1. 安装插件： yarn add http-proxy-middleware -g2. 在'src'目录下新建'setupProxy.js'并写入：报错“proxy is not a function”，是因为版本问题//http-proxy-middleware版本是1.*.* 上如下调用const { createProxyMiddleware } = require('http-proxy-middleware');module.exports = function (app) {
2021-04-20 23:38:39
281
原创 前端模拟数据json
模拟数据 json-serverjson-server就是用来完成模拟数据的，让本地开发不止是静态数据，而是模拟request请求，以及请求回来的过程。安装环境：npm install json-server -g查看版本：json-server --version1、创建数据：在项目目录下创建一个 mock 的文件夹并且写入相关的数据 如：data.json ：2、启动json-server默认端口为3000 ，我们不能直接启动，会和react脚手架冲突 ，所以我们启动的时候需要修改端
2021-04-20 23:29:11
883
原创 webpack
Webpack是一个打包模块化JavaScript的工具，它会从入口模块出发，识别出源码中的模块化导入语句，递归地找出入口文件的所有依赖，将入口和其所有的依赖打包到一个单独的文件中，是工程化、自动化思想在前端开发中的体现。webpack官网https://webpack.js.org1.安装npm install webpack webpack-cli --dev不建议全局安装，因为全局安装webpack，这会将你项目中的webpack锁定到指定版本，造成不同的项目中因为webpack依..
2021-04-16 22:15:23
80
原创 Redux
Redux 是负责组织 state 的工具，但你也要考虑它是否适合你的情况。不不要因为有人告诉你要用 Redux就去用，花点时间好好想想使用了了 Redux 会带来的好处或坏处。在下面的场景中，引入 Redux 是比较明智的：你有着相当大量量的、随时间变化的数据； 你的 state 需要有一个单一可靠数据来源； 你觉得把所有 state 放在最顶层组件中已经无法满足需要了了。 某个组件的状态需要共享。1. redux安装npm install redux --save2.redux原
2021-03-26 12:31:27
66
原创 npm 和yarn 使用指南
1.NPM和Yarn概念？NPM 是随 NodeJs 一同安装的 JavaScript 的包管理器。NPM 官网：https://www.npmjs.com/Yarn 是Yarn 官网：2.安装npm一般安装node时，就自带了npm，主要讲yarn的安装。npm install -g yarn3.NPM和yarn常用指令npm yarn 说明 npm -v yarn -v 查询版本 npm init yarn init 初始化某个项
2021-03-24 18:58:19
380
原创 flex 弹性布局
一、什么是Flex布局？flex布局表示弹性布局，为盒状模型提供最大的灵活性。好处用6个字概括是：简单、方便、快速，任何一个容器都可以指定为Flex 布局。注意事项：如果是Webkit内核的浏览器，需要加上-webkit前缀 在父级元素设置为flex布局后，子元素的float、clear、vertical-align属性都将失效，所以在使用flex布局时，不应该先设置完子元素布局后再使用..box{ display：flex}.box{ display:inline-flex} /..
2021-02-28 02:34:01
89
原创 AEM 环境配置
一.环境准备.1.JDK安装配置。JAVA_HOME="C:\SWDTOOLS\jdk1.8.0_66"path="%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;%M2_HOME%\bin;"2.MAVEN安装配置M2_HOME="C:\SWDTOOLS\apache-maven-3.0.4"3.准备CQ和授权文件。二、启动AEM Au...
2020-08-10 14:54:55
311
1
原创 HOC（Higher-Order Components）高阶组件
为了提高组件复用率，可测试性，就要保证组件功能单一性；但是若要满足复杂需求就要扩展功能单一的组件，在React里就有了HOC（Higher-Order Components）的概念。定义：高阶组件是参数为组件（function组件或class组件），返回值为新组件的函数。// hoc: 是一个函数，接收一个组件，返回另外一个组件；//这里写开头的Cmp是指function或者class...
2020-03-31 16:33:55
112
原创 React之PureComponent
PureComponent与Component比较React.PureComponent 与 React.Component 很相似。两者的区别在于 React.Component 并未实现 shouldComponentUpdate() ，而 React.PureComponent 中以浅层对比 prop 和 state 的方式来实现了了该函数。如果赋予 React 组件相同的 pro...
2020-01-08 16:03:40
377
原创 React 组件
React组件分为两种：class类组件和function函数组件。React创建组件的三种方式及其区别，具体三种方式：a. 函数式定义的无状态组件b. ES5原生方式React.createClass 定义的组件c. ES6形式的 extends React.Component 定义的组件1. 无状态组件function HelloComponent(props, /* co...
2020-01-07 14:55:17
101
原创 React-redux学习
react-redux将redux引入到react里面去使用。1).import {Provider} from "react-redux"; 将redux store中的值传入react组件 例子：<Provider store={store}> <App /> </Provider>2)...
2020-01-06 19:11:55
176
原创 React-router 路由学习记录
当应用逐渐庞大、复杂、组件也越来越多，这个时候需要有一种机制来管理和维护我们的应用和组件，使用 url 和组件进行关联对影视一个可行的有效的方式，路由一.安装.npm i create-router-dom二.组件使用. 1). import {BrowserRouter,Switch,Route} from "react-router-dom"; 该组件使用 HTML...
2020-01-06 15:07:33
144
原创 Vue 环境安装
一、window环境安装1.安装vuenpm install -g vue //安装vue npm install -g @vue/cli // 全局安装vue/cli2.环境验证.3.创建项目.vue create my-project //vue项目创建4.项目启动.cd my-vue-testnpm run serv...
2020-01-02 17:55:57
108
原创 Vscode记录
1. Vscode二、调式1.默认支持node调式，F5启动调式.2.若要支持网页调式，需要装 Debugger for Chrome，如下是基本配置在按F5 选择Chrome => terminal （命令面板）=> http-server 启动调式（如何没有安装 npm install http-server -g 全局安装） =>http://...
2019-12-31 15:12:45
145
原创 npm 和yarn 使用指南
1.NPM 是什么？NPM 是随 NodeJs 一同安装的 JavaScript 的包管理器。NPM 官网：https://www.npmjs.com/2.NPM 常用指令1). 查询npm版本npm -v2). 全局安装——可以直接在命令行使用npm install [name] -g 3). 指定版本安装的指令npm install [name]@版本号 ...
2019-12-13 18:20:20
470
原创 安装node、npm及cnpm
安装npm及cnpm(Windows)【工具官网】Node.js :http://nodejs.cn/ 【安装步骤】一、安装node.js1.前往node.js官网下载并安装工具，这里安装路径选到D盘，D:\nodeJS安装完毕在命令行输入以下命令测试是否安装成功，正确会出现版本号检验是否安装成功：node –v ；npm –v2...
2018-03-09 12:13:33
1614
转载 React创建组件的三种方式及其区别
React推出后，出于不同的原因先后出现三种定义react组件的方式，殊途同归；具体的三种方式：函数式定义的无状态组件es5原生方式React.createClass定义的组件es6形式的extends React.Component定义的组件虽然有三种方式可以定义react的组件，那么这三种定义组件方式有什么不同呢？或者说为什么会出现对应的定义方式呢？下面就简单介绍一下。无状态函数式组件创建无状...
2018-03-09 12:13:09
126
原创 git工具指南
1. git 是版本控制工具。 github是网站，社交平台，开源项目，远程仓库。 github官网：https://github.com github上创建组织，博客。 2. git 与svn 区别？ svn是集成式（版本控制库控制在中央处理）; git是分布式 3.git 工具 不同系统，方式不同 windows系统中有两种模式...
2018-03-09 11:36:38
154
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人