- 博客(31)
- 收藏
- 关注
原创 react中的useRef
前言react hooks 是 React 16.8 的新增特性。 它可以让我们在函数组件中使用 state 、生命周期以及其他react特性,而不仅限于 class 组件。react hooks 的出现,标示着react中不会在存在无状态组件了,只有类组件和函数组件。具体可查看官网。优势:函数组件不能使用state,遇到交互更改状态等复杂逻辑时不能更好地支持,hooks让函数组件更靠近class组件,拥抱函数式编程。解决副作⽤问题,hooks出现可以处理数据获取、订阅、定时执行任务、手动
2020-12-29 16:05:28 2135 1
原创 react使用Context
Context意思为上下文,用于根组件直接把数据给子组件,不必一层一层繁琐的传递props1.引入createContextimport { createContext } from "react"2.创建上下文对象const BatteryContext=createContext();//里面可以放一个初始值//传入的默认值相当于下文中的value3.使用上下文对象提供数据<BatteryContext.Provider value='60' >
2020-12-23 20:25:59 97
原创 react 中的userReducer
useReducer-基础概念篇useReducer-使用篇useReducer-配合useContext使用我们在第一篇文章中介绍了JavaScript中的reducer以及他的一些特点,对reducer不熟悉的小伙伴可以先看看第一篇。React Hook功能正式发布之后,允许在function component中拥有state和副作用(useEffect)。官方提供了两种state管理的hook:useState、useReducer。下面我们会通过一系列Demo逐步说明如何使用useRedu
2020-12-22 10:07:18 819
原创 react中的useState和useEffect
之前我们已经掌握了useState的使用,在 class 中,我们通过在构造函数中设置 this.state 为 { count: 0 } 来初始化 count state 为 0:class Example extends React.Component { constructor(props) { super(props); this.state = { count: 0 }; }在函数组件中,我们没有 this,所以我们不能分配或读取 this.sta
2020-12-22 09:57:59 2024
原创 redux connect
redux connectreact-redux在react-redux 框架中,给我提供了两个常用的API来配合Redux框架的使用,其实在我们的实际项目开发中,我们完全可以不用react-redux框架,但是如果使用此框架,就如虎添翼了。我们来简单聊聊这两个常用的APIconnect()Provider 组件React-Redux 将所有组件分成两大类:UI 组件(presentational component)和容器组件(container component)。UI 组件UI 组件
2020-12-21 20:32:17 168
原创 redux起步
基本使用import {createStore,combineReducers} from 'redux'const initialState={ //仓库初始值}const CHANGE_MENU="CHANGE_MENU"//dispatch要用到的函数const changeMenu=(menu)=>{ return { type:CHANGE_MENU,//要在reducer调用的action.type payload:men..
2020-12-19 18:25:47 96 1
原创 TypeScript起步
1.在全局中安装typescriptnpm i typescript -g2.编写.ts文件3.编译.ts文件tsc filename.ts//会生成filename.js文件//然后用node执行js文件typescript类型TS基本类型TS变量声明var [变量名] : [类型] = 值;声明变量并初始值,但不设置类型,该变量可以是任意类型:var [变量名] = 值;TS类型断言(Type Assertion)类型断言可以用来手动指定一个值的类型,即允许变量从
2020-12-19 14:05:57 223 1
原创 使用umi创建react项目
环境准备首先得有 node,并确保 node 版本是 10.13 或以上。(mac 下推荐使用 nvm 来管理 node 版本)$ node -vv10.13.0推荐使用 yarn 管理 npm 依赖,并使用国内源(阿里用户使用内网源)。国内源$ npm i yarn tyarn -g后面文档里的 yarn 换成 tyarn$ tyarn -v阿里内网源$ tnpm i yarn @ali/yarn -g后面文档里的 yarn 换成 ayarn$ ayarn -v脚手架先找个地
2020-12-19 12:17:18 2483 1
原创 使用node发送请求
使用node发送请求没有同源限制1.使用fiddler抓取需要发送的请求的包的信息2.使用node做服务,获取传送的信息var http=require("http");var fs=require("fs");var cheerio=require("cheerio");const request = require('request')const express=require('express')const app=new express();var time=new Date().
2020-12-17 21:29:00 1303 2
原创 嵌入式系复习
μC/OS-II中共有64个优先级(0~63级,数字越小优先级越高)获取命令帮助man (command)获取命令参数command --help显示工作目录pwd切换目录cd /user/bin显示当前目录ls-1 每列仅显示一个文件或目录名称。-a 显示下所有文件和目录。-A 显示所有文件和目录,但不显示现行目录和上层目录。-c 以更改时间排序,显示文件和目录。-d
2020-12-16 15:17:52 309
原创 使用fiddler进行发包
1.首先要抓到请求(如下)2.直接将这个请求拖动到composer中,fiddler会自动为你填充请求方法,地址以及请求头等信息然后点右边那个执行就可以了
2020-12-15 10:00:37 2586
原创 使用fiddler进行拦截替换
在fiddler中的AutoResponser中选中Enable RuleAccept all ConnectsUnmatched requests passthrough接下来就是添加拦截的规则了,比如404或者对某个资源进行替换
2020-12-14 19:06:04 1495
原创 React 起步
1.安装react脚手架npm i create-react-appcreate-react-app appNamecd appNamenpm start2.react项目文件index.html是根目录文件index.js中得render函数将跟组件挂载到index.html中得跟元素root中index.jsimport React from 'react';import ReactDOM from 'react-dom'import App from './App.js'R
2020-12-12 21:53:17 148
原创 JS经典面试题
function bigNumberAdd(n1,n2){ let result=""; let sn1=n1.split(""); let sn2=n2.split(""); let carry=false; while(sn1.length||sn2.left||carry) { // 每次将最后的数字进行相加,使用~~的好处是,即使返回值为 undefined 也能转换为 0 carry+=~~sn1.pop()+~~sn2.pop(); // 取加法结果的个位加入最终结果
2020-12-10 21:55:27 113
原创 动态规划
动态规划爬楼梯问题有一座高度是10级台阶的楼梯,从下往上走,每跨一步只能向上1级或者2级台阶。要求用程序来求出一共有多少种走法?递归方法分析由分析可知,假设我们只差最后一步就能走上第10级阶梯,这个时候一共有两种情况,因为每一步只允许走1级或2级阶梯,因此分别为从8级阶梯和从9九级阶梯走上去的情况。因此从0到10级阶梯的走法数量就等于从0到9级阶梯的走法数量加上从0到8级阶梯的走法数量。依次类推,我们可以得到一个递归关系,递归结束的标志为从0到1级阶梯的走法数量和从0到2级阶梯的走法数量。代
2020-12-10 19:36:41 148
原创 反转链表
function reverseList(head){ /** 需要将一个单向链表反转。思路很简单,使用三个变量分别表示当前节点和当前节点的前后节点,虽然这题很简单,但是却是一道面试常考题。思路是从头节点往后遍历,先获取下一个节点,然后将当前节点的 next 设置为前一个节点,然后再继续循环。 */ if(head===null) return let pre=null; let current=head; let next; while(current) { next=
2020-12-10 14:37:05 65
原创 哈夫曼树
路径:在一棵树中,一个结点到另一个结点之间的通路,称为路径。图 1 中,从根结点到结点 a 之间的通路就是一条路径。路径长度:在一条路径中,每经过一个结点,路径长度都要加 1 。例如在一棵树中,规定根结点所在层数为1层,那么从根结点到第 i 层结点的路径长度为 i - 1 。图 1 中从根结点到结点 c 的路径长度为 3。结点的权:给每一个结点赋予一个新的数值,被称为这个结点的权。例如,图 1 中结点 a 的权为 7,结点 b 的权为 5。结点的带权路径长度:指的是从根结点到该结点之间的路径长度
2020-12-10 14:30:31 952
原创 js实现平衡二叉树
平衡二叉树定义(AVL):它或者是一颗空树,或者具有以下性质的二叉排序树:它的左子树和右子树的深度之差(平衡因子)的绝对值不超过1,且它的左子树和右子树都是一颗平衡二叉树平衡二叉树必须是二叉搜索树var Node=function(key){ this.key=key; this.lchild=null; this.rchild=null; this.height=1;//平衡因子}var root = null;//根节点getRoot=function(){return r.
2020-12-10 13:39:06 413
原创 二叉树
满二叉树如果二叉树中除了叶子节点,每个节点的度都为2则该二叉树为满二叉树满二叉树不存在度为1的节点完全二叉树如果二叉树中除去最后一层节点(叶子节点)为满二叉树切最后一层节点从左到右分布(中间不能有空)则这个二叉树交左完全二叉树JS创建二叉树function BinaryTree(){ var Node=function(key) { this.key=key; this.lchild=null; this.rchild=null; }var ro.
2020-12-10 12:09:25 114
原创 二分查找
function binarySearch(item,arr){ let low=0; let high=arr.length-1; let mid; while(low<=high) { mid=Math.floor((low+high)/2) if(item==arr[mid]) return mid else if(arr[mid]>item) high=mid-1 else low=mid+1 } return "null" }
2020-12-09 19:20:42 53
原创 二分查找
function binarySearch(item,arr){ let low=0; let high=arr.length-1; let mid; while(low<=high) { mid=Math.floor((low+high)/2) if(item==arr[mid]) return mid else if(arr[mid]>item) high=mid-1 else low=mid+1 } return "null" }
2020-12-09 19:11:46 60
原创 十大经典排序算法
//冒泡排序function bubbleSort(arr){ var length=arr.length; var temp; for(var i=0;i<length-1;i++) { for(var j=0;j<length-1-i;j++) { if (arr[j] > arr[j+1]) { // 相邻元素两两对比 temp = arr[j+1]; // 元素交换
2020-12-09 15:58:00 68
原创 vue中动态引入图片的问题
1.import方式<img :src="logo">import logo from '@assets/images/avatar.png';data() { return { logo }}2.require方式<img :src="logo">data() { return { logo:require("@assets/images/avatar.png") }}
2020-12-09 09:58:04 319
原创 C#实验1
实验1-1 问候 (20分)输出问候:Hello!What's your name? 从键盘输入名字,然后输出欢迎信息。输入格式:请在这里写输入姓名。例如: GaiFuShuai输出格式:请在这里描述输出,例如:Hello!What's your name?GaiFuShuai,Welcome to learn OOP using C++!输入样例:BaiFuMei代码using System;using System.Collections.Generic;usi
2020-12-07 10:10:33 3022
原创 react的组件
1.函数式组件import React from 'react'function App(){ return <h1>函数式组件</h1>}export default App;2.类式组件import React from 'react'class App extends React.Component{ render(){ return <h1>类式组件</h1> }}export defau
2020-12-02 21:17:05 73
原创 react中 create-react-app脚手架的使用
1.npm全局安装脚手架npm install create-react-app -g//-g=global就是全局安装的意思2.创建react项目create-react-app demoName3.进入创建的项目的文件夹cd demoName4.启动服务npm start如果要打包项目文件部署到线上的话npm run build在src中只有这个index.js文件是可用的所以一般会删除其他的文件,注意删除其他文件和依赖之后会报错,把node_modules删除之后
2020-12-02 15:52:53 101
原创 react第一天
ReactDOM提供了与浏览器交互的DOM,功能如DOM渲染ReactDOM.render(element,container[,callback])//element是要渲染的内容//container是要渲染内容存在的容器//callback是渲染成功后的回调函数如<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="view
2020-12-02 13:27:14 114
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人