- 博客(24)
- 收藏
- 关注
原创 重排和重绘
重排(回流):当前页面结构或标签尺寸发生变化时,浏览器需要对页面进行重排,并重新渲染 重绘:当前页面上的标签的外观发生改变,浏览器需要重新对页面进行渲染 回流一定导致重绘 display:none把元素隐藏,并且改变页面布局(相当于在页面中把元素删掉),还会引起回流和重绘 visibility=hidden把元素隐藏,不会改变页面布局,也不会触发该元素已经绑定的事件,只会引起重绘 opacity=0元素隐藏,不会改变页面布局,能触发点击事件...
2022-05-24 11:07:08
249
原创 纯函数是什么
1.一类特别的函数:只要是同样的输入(实参),必定得到同样的输出(返回)2.必须遵守一些约束:1)不得改写参数数据2)不会产生任何副作用,例如网络请求,输入和输出设备3)不能调用Data.now()或者Math.random()等不纯的方法3.redux的reducer函数必须是一个纯函数...
2022-04-08 15:37:49
181
原创 useParams()、useSearchParams()、 useLocation()、 useMatch()
useParams()1. 作用:回当前匹配路由的`params`参数,类似于5.x中的`match.params`。useSearchParams()1. 作用:用于读取和修改当前位置的 URL 中的查询字符串。2. 返回一个包含两个值的数组,内容分别为:当前的seaech参数、更新search的函数。useLocation()1. 作用:获取当前 location 信息,对标5.x中的路由组件的`location`属性。useMatch()..
2022-03-24 11:06:50
14047
原创 <Navigate>与useNavigate()
Navigate1. 作用:只要`<Navigate>`组件被渲染,就会修改路径,切换视图。2. `replace`属性用于控制跳转模式(push 或 replace,默认是push)。useNavigate()1. 作用:返回一个函数用来实现编程式导航。...
2022-03-24 10:58:01
3817
原创 <Routes/> 与 <Route/>
1. v6版本中移出了先前的`<Switch>`,引入了新的替代者:`<Routes>`。2. `<Routes>` 和 `<Route>`要配合使用,且必须要用`<Routes>`包裹`<Route>`。3. `<Route>` 相当于一个 if 语句,如果其路径与当前 URL 匹配,则呈现其对应的组件。4. `<Route caseSensitive>` 属性用于指定:匹配时是否区分大小写(默认为
2022-03-24 10:53:16
488
原创 Link与NavLink(router6)
<Link>1. 作用: 修改URL,且不发送网络请求(路由链接)。2. 注意: 外侧需要用`<BrowserRouter>`或`<HashRouter>`包裹。<NavLink>1. 作用: 与`<Link>`组件类似,且可实现导航的“高亮”效果。...
2022-03-24 10:47:18
592
原创 BrowserRouter与HashRouter的区别
1.底层原理不一样:BrowserRouter使用的是H5的history API,不兼容IE9及以下版本。HashRouter使用的是URL的哈希值。2.path表现形式不一样BrowserRouter的路径中没有#,例如:localhost:3000/demo/testHashRouter的路径包含#,例如:localhost:3000/#/demo/test3.刷新后对路由s...
2022-03-16 10:50:43
2735
转载 向路由组件传递参数
1.params参数2.search参数3.state参数总结:1.params参数 路由链接(携带参数):<Link to='/demo/test/tom/18'}>详情</Link> 注册路由(声明接收):<Route path="/demo/test/:name/:age" component={Test}/> 接收参数:this.props.match.params2.sear...
2022-03-16 09:34:57
79
原创 路由组件与一般组件
1.写法不同: 一般组件:<Demo/> 路由组件:<Route path="/demo" component={Demo}/> 2.存放位置不同: 一般组件:components 路由组件:pages...
2022-03-14 11:19:30
428
原创 react路由
SPA的理解:1)单页web应用2)整个应用只有一个完整的页面3)点击页面中的链接不会刷新页面,只会做页面的局部更新 4)数据都需要通过ajax请求获取,并在前端异步实现1.一个路由就是一个映射关系(key:value)key(path),value(function,component)2.后端路由(value是function),用来处理客户端提交的请...
2022-03-04 16:25:32
431
原创 创建react项目
1.全局安装 npm i -gcreate-react-app(如果失败,npm i -gcreate-react-app -f)2.进入到你想创建项目的目录中,create-react-app 项目名称3.进入项目文件夹 :cd4.启动项目:npm start/yarn start
2022-02-24 15:34:17
309
原创 组件的生命周期
1.组件从创建到死亡它会经历一些特定的阶段2.react组件中包含一系列钩子函数(生命周期回调函数),会在特定的时刻调用3.我们在定义组件时,会在特定的生命周期回调函数中,做特定的工作...
2022-02-23 14:33:34
320
原创 git commit -m “xxx“提交时报running commit-msg hook: fabric verify-commit
使用这个命令 git commit -m 'xxx' --no-verify
2022-02-22 16:04:17
12716
原创 高阶函数-函数柯里化
(1) 高阶函数:如果一个函数符合下面两个规范中的任何一个,那该函数就是高阶函数 1.若A函数,接收的参数是一个函数,那么A就可以称之为高阶函数 2.若A函数,调用的返回值依然是一个函数,那么A就可以称之为高阶函数 常见的高阶函数: 1.Promise //new Promise(()=>{})内置的构造函数 2.se...
2022-02-14 14:07:29
461
1
原创 组件实例的三大核心属性之二-refs
1.字符串形式的ref(能避免使用尽量避免)2.回调函数形式内联的回调函数和class的绑定函数(一般使用内联)3.createRef创建容器(每次使用都要创建)
2022-01-19 09:52:15
181
原创 组件实例的三大核心属性之一-state
1.state是组件对象最重要的属性,值是对象(可以包含多个key-value的组合)2.组件被称为状态机,通过更新组件的state来更新对应的页面显示(重新渲染组件)注意:1.组件中render方法中this为组件实例对象2.组件自定义的方法中this为undefined,如何解决?a.强制绑定this:通过函数对象的bindb.箭头函数3.状态数据不能直接修改或更新,要通过setState...
2022-01-18 09:43:24
407
原创 react模块与组件
1.模块,就是一个js文件,盒子布局只拆html,复用js2.模块化,当应用的js都以模块来编写,这个应用就是一个模块化的应用。3.组件,代码+资源的集合(html、css、js、image)复用编码4.组件化,把一个复杂的功能拆分成一个个小组件,这个应用就是一个组件化的应用...
2022-01-12 11:11:36
161
原创 创建vue项目
1.npm install -g @vue/cli@3.0.1全局安装Vuecli2.npm install -g @vue/cli-service-global@3.0.1版本号保持一致3.创建项目vue create vue-project4.创建成功
2022-01-10 15:57:11
262
原创 git修改网页代码
1.创建分支git checkout -b ‘分支名称’(一般命名为 名字-文件名-日期)2.修改代码3.git push查看命令,复制运行一下
2021-12-30 13:39:56
342
原创 webpack的配置
1.安装webpack2.在项目中配置webpack(1)在项目根目录下创建webpack.config.js并添加内容如下:(2)在package.json中的script节点下,添加内容,dev可以随意命名(3)在终端运行,输入npm run dev,对webpack启动,进行项目的打包构建...
2021-12-07 17:14:33
482
原创 git命令上传项目
前提是密钥已经生成1.cd 进入到项目所在文件2. git init3. git路径是自己在git分支中的路径,本地与远程同步,然后把文件添加到版本库中4.把文件提交到仓库红线名字为你要导入项目的名称如果出现就输入git config --global user.email “你的邮箱”。回车输入git config --global user.name “你的github用户名”5.项目添加之后,把本地库的内容推送到远程git push -u origin master6.此时
2021-11-23 12:54:14
863
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人