- 博客(23)
- 收藏
- 关注
RSS订阅原创 前端常用网站汇总
一、常用组件类Bootstrap 官网ElementUI 官网iView 官网SUI Mobile 官网Mint UI 官网Swiper 官网Ant Design 官网二、实用工具类Easy Mock伪造数据 官网Mock.js 随机数据 官网BootCDN 加速服务 官网npm.js 官网Webpack 打包资源 官网Echarts 图表工具 官网Highch...
2019-09-17 21:53:47
226
原创 05-React项目使用Swiper，Hook
一、使用Swiper1、在项目入口文件index.js中引入样式import 'swiper/dist/css/swiper.css'2、按需使用html结构3、初始化swiper在componentDidUpdate()钩子中写入初始化js代码(不要忘记import Swiper from ‘swiper’)Swiper使用步骤—官网二、Hook1、Hook 是 React...
2019-09-17 21:32:01
1292
1
原创 04-React生命周期钩子（15、16及未来版本）
前言：React中组件有生命周期，在16.3版本之后，我们把生命周期分为四个阶段：初始化、运行中、销毁和错误处理。值得注意的是，生命周期的钩子一定不要写成箭头函数！一、15版本的钩子getDefaultProps() （16版本已弃用）getInitialState() （16版本已弃用）componen...
2019-09-17 20:58:44
349
原创 03-React脚手架工具dva和umi，组件库引入，高阶组件
一、DVA1、安装dva-cli确保dva版本在0.9.1或以上$ npm install dva-cli -g$ dva -vdva-cli version 0.9.12、创建新应用$ dva new project_name3、进入项目目录，并启动开发服务器$ cd dva-quickstart$ npm start详见dva官网二、UMI1、安装umi$...
2019-09-17 20:53:01
660
原创 02-React受控组件及非受控组件、数据渲染、事件处理、组件通信
一、受控组件和非受控组件React组件的数据渲染是否被调用 是通过 传递过来的props完全控制控制则为受控组件，否则非受控组件。二、数据渲染1、条件渲染{ flag ? "开启" : "关闭" }2、列表渲染渲染的元素必须用key属性做唯一标识const people = [{ id: 1, name: 'Leo', age: 35}, { id: 2...
2019-09-16 16:07:30
267
原创 01-React安装(CRA)、概念、组件创建-嵌套-组合-样式-数据挂载的两种方式
一、create-react-app（CRA）1、安装create-react-app$ npm install -g create-react-app如果不想全局安装，可以使用npx安装npx create-react-app appName1、如果npm安装失败，可切换为npm淘宝镜像，2、或者使用yarnyarn config set registry https://re...
2019-09-16 14:49:42
763
原创 11-vuex概念、数据分块、四种使用方案、辅助工具
一、Vuex1、概念Vuex是Vue的状态管理工具，也是多组件状态共享的工具Vuex相当于Vue的一个集中式的存储仓库它存储的是数据（状态）存储仓库：本地仓库 cookie 数据库集中式数据管理，一处修改，多处使用适合中大型应用2、为什么使用Vuex实现流程化，让项目的运行更加优化3、状态和状态管理模式用一条数据去管理一个视图，那这个数据就称为“状态”用一...
2019-09-16 09:11:14
190
原创 10-git基础命令
一、git操作1、概念git是一个分布式版本控制工具2、安装gitbash.exe3、基础命令初始化git$ git init将本地文件提交到暂存区$ git add .将暂存区文件提交到仓库本地仓库存储区$ git commit -m '对当前提交的说明和版本号'查看提交日志$ git log查看简洁版提交日志$ git log --onli...
2019-09-02 22:05:52
87
原创 08-Vue.js路由功能、使用步骤
一、单页面应用SPA(single page app)1、多页面应用：多个html文件，通过a标签对的连接联通各个页面缺点：开发太冗余，编译、压缩耗时间页面间跳转速度慢，跳转空隙会出现白屏2、单页面应用优点：不需要刷新页面切换的是页面内容，用路由实现二、路由功能1、实现单页面的切换2、路由携带参数、传递参数3、路由的导航守卫4、路由进行数据预载（即进入组件前就获得...
2019-09-02 19:49:17
156
原创 07-Vue.js自动化工具webpack(全)
一、前端自动化（工程化）工具1、grunt2、gulp3、Browserify（webpack的前身）4、Webpack（流行）5、rollup.js6、parcel7、·········二、Webpack概念webpack是一个JavaScript应用程序的静态模块打包器。当webpack处理应用程序时，会递归的构建依赖关系图，其中包含需要的各个模块，然后将这些模块打包成一...
2019-09-02 16:13:09
164
原创 06-Vue.js生命周期详解、cli安装和创建项目
一、生命周期<1>初始化beforeCreate组件创建前为整个生命周期做准备工作，初始化事件和自身或是子组件的生命周期做准备数据拿不到真实DOM拿不到不常用created组件创建结束初始化注入其他选项和激活选项数据可以拿到（可做数据请求、修改数据）真实DOM拿不到beforeMount组件挂载前数据可以拿到（可做数据请求、修改数据）真实...
2019-09-02 14:55:58
110
原创 05-Vue.js虚拟DOM、diff算法、生命周期
一、虚拟DOM、Diff算法1、操作真实DOM越少越好，尽量多操作数据2、虚拟dom对象模型来模拟真实DOM3、当一个页面很复杂时，DOM结构的模拟就变得复杂了，所以Vue使用了JSX语法糖JSX javascript+xml让我们可以在Js中写domrender将jsx通过render方法解析成对象模型4、完整流程template模板使用jsx语法进行编辑通过ren...
2019-09-02 14:34:20
373
原创 04-Vue.js组件通信、slot插槽、过渡效果、过滤器、自定义指令
一、组件的通信1、为什么通信？组件是一个聚合体，合并项目后，各个组件之间需要建立联系2、分类<1>父子组件通信data选项为什么是一个函数？因为组件是一个聚合体，也是一个整体，它需要一个独立的作用空间，它的数据是需要独立的。目前JS最大的特点是函数式编程，而函数恰好提供了一个独立作用域，所以data在除了根组件外的组件里都是函数为什么data函数需要一个返回值...
2019-08-23 20:33:36
209
原创 03-Vue.js-axios和fetch、计算属性、混入、组件
一、axios和fetch1、目的：在框架中使用数据请求2、分类：原生js提供的fetch使用第三方封装库axiosVue中可以统一对axios进行挂载Vue.prototype.$http=axios3、请求方式请求静态数据（模拟假数据—mock数据）请求动态数据 （通过后端接口请求数据）4、axios和fetch的区别axios对已获得的数据进行了封装，防止XS...
2019-08-23 20:10:03
233
原创 01-Vue.js历史、概念、深入响应式原理
1、Vue官网Vue官网2、后端架构思想M Model 数据层V View 视图层VM ViewModel 视图模型（ 业务逻辑 VM 是 由 P 改名得来的）P Presenter 提出者（ Controller 改名得来的 ）C Controller 控制器 (业务逻辑 )3、前端的重要年份2016年es6vue2.0ang...
2019-08-21 17:58:22
119
原创 02-Vue.js语法规范、转移和非转移输出、类名绑定、样式绑定、条件渲染、列表渲染、事件处理器、表单控件绑定
1、语法规范双大括号语法中，可以写{{this.__data.msg}}、{{this.$data.msg}}、{{this.msg}}、{{msg}}_ _和$都是内部私有属性的一种标识，不希望外用2、模板语法：mustache语法的大括号内支持写jsnull和undefined不会显示，其他数据类型都可以正常显示挂载在window对象上的全局属性，如console...
2019-08-21 17:45:12
186
原创 06_node.js身份验证、加密算法、测试工具
一、 身份验证1、JWT(JSON Web Token)用户登录，服务器产生一个token（加密字符串）发送给前端前端将token进行保存前端发起数据请求的时候携带token服务端验证token是否合法，如果合法则继续操作，不合法就终止操作token的使用场景：无状态请求，保持用户的登录状态，第三方登录2、非对称加密 通过私钥产生token 通过公钥解密token安装O...
2019-08-20 11:29:10
153
原创 05_node.js-MongoDB命令、数据库操作步骤
1、MongoDB命令db.webs.find().sort({age:-1})降序db.webs.find().skip(2)从下标为2开始db.webs.find().limit(2)从开始到2结束sort()的优先级比skip和limit高所以无论书写先后，都是先排序2、node是什么模型？——对象模型3、express中req,body失效问题post方法在e...
2019-08-20 11:00:04
124
原创 04_node.js模拟聊天室
创建小型聊天室index1.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=...
2019-08-15 20:41:18
132
原创 03_node.js脚手架express、express打造静态服务器、前端通信
一、express生成器（脚手架）1、 作用：帮助快速构建一个express项目2、 脚手架的安装（1）全局安装（npm或cnmp） $ cnpm i express-generator -g（2）npx安装 npx是n...
2019-08-14 22:21:04
319
原创 02_node.js流、爬虫、模块化、npm上传自定义包、前端环境
stream流：node.js中数据是分片（chunk）传输的为了提高性能，较少cpu能耗，创建了管道流pipe。它是连接I/O之间的一个管道。gulp就是依赖了node.js中流的概念，才在与grunt的竞争中胜出。示例代码：const zlib = require("zlib");//zlib是压缩包的内置模块（插件）const fs require("fs");const i...
2019-08-13 17:38:56
212
原创 01_node.js概念、api、命令
1、node.js下载node.js官网 https://nodejs.org/en/两个版本：LTS和current（由于收购原因）安装时，高版本会覆盖低版本版本常识：偶数为稳定版-----奇数为非稳定版2、什么是node.js?node.js是一个基于谷歌V8引擎的JavaScript运行环境（用来运行和解析JS代码）node.js使用了事件驱动（执行任务）、非阻塞式（异步...
2019-08-12 17:22:04
182
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人