- 博客(32)
- 收藏
- 关注
原创 React自定义组件--Button
React自定义组件--Button这是主要js代码import React, { Component } from 'react'import "./dist/index.css";import PropTypes from "prop-types";import classnames from "classnames";class Button extends Component { constructor(props) { super(props);
2021-03-31 17:13:14
1900
原创 react 和 vue 中表格中图片放大插件
React中的图片浏览器 在表格里面使用前提是要装一个一个插件,插件安装命令如下npm install @hanyk/rc-viewer在表格里面使用的情况{ title: '图片', align: "center", dataIndex: 'imgUrl', key: 'imgUrl', render: (imgUrl, row) => { return ( imgUrl && <RcViewer r
2020-05-13 16:42:22
398
原创 关于React国际化的问题
关于React国际化的问题??引入国际化的插件plugins:[ ..., locale: { enable: true, default: 'zh-CN', baseNavigator: true, }, ...,]就可以在代码中使用全球化的功能了。详细配置参见config。@umijs/plugin-locale 封装了react-intl, api 与 react-intl 基本相同,并做了封装使用起来更加方便。全部 api 如下import {
2020-05-13 15:21:23
756
原创 antd upload 上传的问题------react----vue好像也是这个丫子
获取文件是用 beforeUpload这个钩子 获取的是你上传的文件对象也就是file img: (binary)这里是在页面上获取到图片文件然后存到tate里面
2020-05-12 13:46:58
491
原创 React Router
React RouterReact Router现在的版本是5, 于2019年3月21日搞笑的发布,搞笑的官网链接, 本来是要发布4.4的版本的,结果成了5。从4开始,使用方式相对于之前版本的思想有所不同。之前版本的思想是传统的思想:路由应该统一在一处渲染, Router 4之后是这样的思想:一切皆组件React Router包含了四个包:包名Descriptionrea...
2019-07-15 09:39:00
329
原创 React状态管理
状态管理传统MVC框架的缺陷什么是MVC?[外链图片转存失败(img-5UKs5YTH-1563154546022)(./images/mvc-base.png)]MVC的全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,是一种软件设计典范。V即View视图是指用户看到并与之交互的界面。M即Model模型是管...
2019-07-15 09:36:25
1311
原创 React组件通信
组件通信分类: 父子组件通信 无论父组件传递是props还是state,子组件都是通过props接收 子父组件通信 父组件传递方法给子组件,子组件调用父组件传递过来的方法 注意: 自己的状态自己更改 非父子组件通信 ref链 1. ref = ‘xxx’ this.refs.xxx 2. ref = { el =>...
2019-07-15 09:34:46
168
原创 React组件的生命周期
组件的生命周期React中组件有生命周期,也就是说也有很多钩子函数供我们使用, 组件的生命周期,我们会分为四个阶段,初始化、运行中、销毁、错误处理(16.3之后) 生命周期钩子函数一定不要写成箭头函数初始化在组件初始化阶段会执行 1. constructor 2. static getDerivedStateFromProps() ...
2019-07-15 09:33:43
249
原创 React事件处理
事件处理绑定事件采用on+事件名的方式来绑定一个事件,注意,这里和原生的事件是有区别的,原生的事件全是小写onclick, React里的事件是驼峰onClick,React的事件并不是原生事件,而是合成事件。事件handler的写法 【 王牌 || 王者】直接在render里写行内的箭头函数(不推荐)在组件内使用箭头函数定义一个方法(推荐)直接在组件内定义一个非箭头函数的方法,然后...
2019-07-15 09:32:32
124
原创 属性and状态
属性(props)props是正常从外部传入的,组件内部也可以通过一些方式来初始化的设置,属性不能被组件自己更改,但是你可以通过父组件主动重新渲染的方式来传入新的 props属性是描述性质、特点的,组件自己不能随意更改。之前的组件代码里面有props的简单使用,总的来说,在使用一个组件的时候,可以把参数放在标签的属性当中,所有的属性都会作为组件 props 对象的键值。通过箭头函数创建的组件...
2019-07-15 09:31:22
345
原创 元素与组件
元素与组件如果代码多了之后,不可能一直在render方法里写,所以就需要把里面的代码提出来,定义一个变量,像这样:import React from 'react'import ReactDOM from 'react-dom'// 这里感觉又不习惯了?这是在用JSX定义一下react元素const app = '<h1>欢迎进入React的世界</h1>'Re...
2019-07-15 09:27:27
315
原创 webpack
webpackwebpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle其它相似打包工具还有rollup.js 、 parcel、FIS等webpack可以自动解...
2019-07-15 09:24:24
165
原创 关于React
关于ReactReact的起源和发展React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设Instagram 的网站。做出来以后,发现这套东西很好用,就在2013年5月开源了。React与传统MVC的关系轻量级的视图层库!A JavaScript library for building user ...
2019-07-15 09:23:01
101
原创 cli3
一、生命周期 ( 王者 )什么是生命周期?vue中的生命周期指的是 组件 从创建到销毁一个过程,在这个过程中,我们在每一个特定的阶段会触发一些方法( 这些方法具备一些功能),我们给这些方法起了个名字叫做( 生命周期钩子函数/ 组件钩子 )为什么要学习生命周期?因为我们想在生命周期钩子中实现项目功能,那么我们必须知道每一个钩子函数的具体用途这个生命周期是谁的生命周期?组件项...
2019-07-01 23:25:04
265
原创 Webpack
Webpack一、市面上有哪些类似于Webpack的前端工程化工具gruntgulp ( 4.x )Browserify ( Webpack 前身 )Webpack 【 主流行 】rollup.js https://www.rollupjs.com/guide/zhparcelFIS https://fis.baidu.com/二、前端工程化工具的发展历程grunt...
2019-07-01 23:22:34
119
转载 一次完整的HTTP请求发生了什么?
一次完整的HTTP请求发生了什么?当我们在浏览器的地址栏输入 www.baidu.com,然后回车,回车这一瞬间到看到页面这一过程到底发生了什么呢?我们看一下下图:关于HTTP协议可以参考以下:HTTP协议漫谈 http://kb.cnblogs.com/page/140611/HTTP协议概览 http://www.cnblogs.com/vamei/archive/2013/05...
2019-06-27 20:50:14
1052
原创 vue生命周期
生命周期什么是生命周期?vue中的生命周期指的是 组件 从创建到销毁一个过程,在这个过程中,我们在每一个特定的阶段会触发一些方法( 这些方法具备一些功能),我们给这些方法起了个名字叫做( 生命周期钩子函数/ 组件钩子 )为什么要学习生命周期?因为我们想在生命周期钩子中实现项目功能,那么我们必须知道每一个钩子函数的具体用途这个生命周期是谁的生命周期?组件项目中生命周期如何书写( 功...
2019-06-27 11:01:19
204
原创 新 旧 slot 作用域插槽 属性验证
slot 作用域插槽旧: slot-scope使用流程在组件的模板中书写slot插槽,并将当前组件的数据通过 v-bind 绑定在 slot标签上在组件使用时,通过slot-scope = “slotProp” 来接收slot标签身上绑定的数据通过 slotProp.xxx 就可以进行使用了 <!DOCTYPE html> <html lan...
2019-06-27 10:56:55
221
原创 组件通信 手动挂载 自定义事件 动态事件 slot插槽
组件通信为什么要进行组件通信?组件可以说是具有独立功能的整体,但是当我们要将这些组件拼接在一起时,这些组件互相之间要建立联系,这个联系我们就称之为通信。组件通信的方式有一下集中(王者级)1.父子组件通信使用props来实现 ```<div id="app"> <Father></Father> </di...
2019-06-26 10:59:40
596
原创 vue的两大特性
vue有两大特性指令—用来操作dom组件—组件是html css js等的一个聚合体组件化1.将一个具备完整功能的项目 的一部分进行多处使用2.加快项目的进度3.可以进行项目的复用要想实现组件化,那么我们使用的这一部分必须是完整的,我们把这个完整的整体称之为组件插件: index.html img css js如果能将html img css js等...
2019-06-24 17:43:22
5242
原创 虚拟dom和diff算法
虚拟dom && diff算法 ( 王者 )什么是虚拟dom它是一个Object对象模型,用来模拟真实dom节点的结构需求vdom 如何模拟真实的dom 如果将来我想在增加一个li,里面的内容为:这是xxx在增加10个li 内容为:miss su <div class = "box"> <ul> &l...
2019-06-24 16:53:37
134
原创 框架级的数据请求 watch 计算属性 mixins 原理
框架级的数据请求axios ( 第三方库 — 别人封装好的库 )fetch ( javascript 原生提供 )vue这边的数据请求的发展vue-resource ( Vue 以前自己封装使用的请求类库 ) ,但是 vue-resource作者已经放弃更新了vue-resource 作者推荐我们使用 axiosvue-resource 用法 和 axios ...
2019-06-21 19:58:18
430
原创 socket几种解决方式
SocketServer.jsconst net = require('net' )const server = new net.createServer()让 客户 = {}让 clientName = 0server.on('connection' ,(client) => { client.name = ++ clientName 客户[...
2019-06-21 19:50:54
727
1
转载 前端开发规范
前端的开发规范本文主要从以下几个方面来概述前端的开发规范目录构建规范前端命名规范前端工作规范开发文档的书写规范1. 前端目录构建规范我们从命名原则、根目录、业务逻辑等方面进行目录构建1.1 命名原则:- 简洁明了(如下:) * src 源代码 * img 图片资源 image images * js JavaScript脚本 * dep 第...
2019-06-21 19:37:32
235
原创 异步流程 数据请求 前端渲染 vs 后端渲染 Middleware
前端异步流程工具Promise √Generator函数Async函数 √Node.js 提供的 nextTick第三方的async.js前端原生js提供的数据请求有两种ajaxfetchgulp 4.x多任务执行串行并行前端渲染 vs 后端渲染前端渲染是通过ajax请求数据,然后通过js语法...
2019-06-21 19:10:35
341
原创 express
express后端渲染一个页面api接口问题: 如果遇到了前后端不分离的项目, 你怎么做?找后端,搭建项目启动的环境找后端模板引擎 ( 找类似于 view 这样的目录 )找静态资源文件目录找对应性文件, index.ejs index.css看效果改js 看效果改cssapi接口暴露测试接口是否正常,我们可以使用测试工具:postman insomniaB...
2019-06-21 19:07:58
89
原创 http爬虫 + http web服务器渲染数据发送前台 + 中文乱码
1. http爬虫 + http web服务器渲染数据发送前台 + 中文乱码```http模块数据请求getrequestpost案例: 后端爬虫名词解释:爬虫: 爬去数据 流程: 后端数据请求 ---》 数据分析 ---》数据清洗 ----》 数据前台发送 爬虫: 并不是所有网站都能爬取的 反爬虫 options 就是一个对象,也是一个配置...
2019-06-12 10:40:25
404
原创 关于This指向,改变指向, 深浅拷贝的几种方法
关于This, 深浅拷贝的几种方法this指向问题this出现在构造函数中,指向构造函数新创建的对象this出现在函数中,那个对象调用,就指向调用者。this出现在全局函数中 永远指向windowthis出现在严格模式中 永远不会指向windowthis出现在原型函数中 参考2this出现在箭头函数中 定义时的环境(父级对象)修改this指向的三种方式Function.pr...
2019-05-20 19:53:55
857
原创 原型+继承的理解(未完待续)
对于原型的一知半解什么是原型对象* 在JavaScript中 每定义一个对象(函数也是对象)的时候对象都会含有一些预定的属性,其中每一个函数对象都有一个prototype,这个属性指向函数的原型对象。定理:每个对象都有一个__proto__,但还是函数对象才会有prototype属性;原型是一个对象,他是对象的实例,用于保存共享的属性和方法代码示例function Person()...
2019-05-20 19:18:27
279
原创 关于闭包
什么是闭包?闭包是一种特殊的函数嵌套,通俗的说就是函数嵌套函数。闭包的特点他可以获取函数内部的变量内部函数被返回到外部可以用在外部调用也就是闭包的通俗说法,函数嵌套函数。闭包的作用可以读取函数内部的变量可以让这些变量始终保存在内存中,这是因为内部函数依赖外部函数的变量,所以只有执行完闭包,才会释放变量所占用的内存闭包的注意事项即缺点因为闭包会...
2019-05-20 15:21:55
234
原创 关于 express中间件的问题
express 中间件 (Middleware)中间件是一个函数,函数中参数有三个:request 请求response 响应next 请求和响应中间的循环流程中间件有三种类型应用级中间件路由中间件错误处理中间件前端的请求方式有几种?getpostputdeleteheadall以上的请求方式统称为: restful apirestfu...
2019-05-16 16:29:17
656
3
原创 什么是Node.js
什么是Node.js?Node.js是一门后端语言基于Chrome v8引擎的js运行环境除此之外:还有其他的引擎: 单片机、actionscriptNode.js有两大特征事件驱动:事件的定义(发布)事件的触发(订阅)非阻塞式 I/O 模型:非阻塞 : 执行一个任务时,不需要等待这个任务执行完成,就可以去执行其他任务I/O: 磁盘文件操作 / 数据库数据操作...
2019-05-14 08:41:08
125
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人