慕课网Jira项目笔记

获取url参数

decodeURIComponent()//解析url里的参数

decodeURIComponent("JavaScript_%D1%88%D0%B5%D0%BB%D0%BB%D1%8B");
//"JavaScript_шеллы"

encodeURIComponent()编码url里的参数

自动化切换环境变量

生产阶段的api放到文件.env.development中 上线阶段的api放到文件.env中

代码中调用使用procsee.去调用，不同的阶段就可以实现变化

删除对象空属性

对属性值为0的属性进行过滤

const isFalsy=(value)=>value === 0 ? true : !!value

删除对象空属性

const clearObject=(value)=>{
    const result={...value}
    Object.keys(result).map(key=>{
        const value = result[key]
        if(!isFalsy(value)){
            delete result[key]
        }
    })
    return result

对象转url参数工具

yarn add -D qs

为什么React列表要加key？并且最后不要用index

react在进行Diffing算法进行比较的时候会比较列表上的key值来看是否需要更新，如果我们前后改动不大，只是在列表最前方加了一项，但导致各项的key值都改变，导致渲染的压力变大浪费性能

useEffect中的return的作用

1，清理上一次useEffect的副作用 2，组件销毁的时候清理组件产生的副作用 3,return 后面应该跟函数，不能跟表达式，不然在加载的时候就运行了

是否要封装为hook

如果函数中用了hook就封装为hook，不然封装为函数即可

表单提交跳转阻止

event.preventDefalut()

context生态问题

函数式编程消参

一元函数可以进行消参

ts操作符Parameters<>,Partial<>,Omit<a,b>

Parameters<> 将一个函数的参数类型以元祖的形式提取出来

parameters<(string,number)=>void> === [string,number]

Partial<> 将参数都变为可选的

type Person={
    name:string
    age:number
}
const xiaoming:Partial<Person>={age:12}

Omit 将属性a中的b属性删除

type Person={
    name:string
    age:number
}
const xiaoming:Omit<Person,'name'>={age:12}
const xiaoming:Omit<Person,'name'|'age'>={}

css样式计算属性calc

fonsize:calc(100vh-2rem)

在react中将图片以标签的形式展示

import {ReactComponent as Svg} from './ceshi.svg'
<Svg width={'18px'}>

实现拖拽

使用包react-beautiful-dnd