- 博客(17)
- 收藏
- 关注
RSS订阅原创 需要整理的东西
js中isNaN和Number.isNaN的区别https://wk.baidu.com/view/b8c49158a16925c52cc58bd63186bceb19e8edf0?pcf=2&bfetype=new
2022-06-06 12:22:33
265
1
原创 js中number()，parseInt（）和parseFloat（）
具体代码如下:alert(parseInt("123abc"));//123，会截取到⾮数值位alert(parseInt("asd123fgh"));//NaN，开头就不是数值alert(parseInt("3.14"));//3 去掉⼩数点后⼩数点不是数值alert(parseInt(""));/NaN，空字符串不是数值alert(parseFloat("3.14abc"));//3.14，会截取到⾮数值位alert(parseFloat("asd3.14fgh"));//NaN
2022-06-06 12:12:13
171
原创 React中Hook的简单使用
Hook是什么？官方文档写的晦涩难懂。Hook 是一些可以让你在函数组件里“钩入” React state 及生命周期等特性的函数。Hook是用于函数组件的，因为函数组件没有生命周期，也是无状态组件，所以我们不能和类组件一样用构造函数里面的state和setState。但是，我们可以用内置Hook来复用不同组件之间的状态逻辑。 先来说说第一个内置hook——State Hook。1.State Hook 一句话概括：this.state的代替品。...
2021-11-10 07:47:58
1255
原创 React+MobX+axios实现权限管理
1.环境配置1）安装脚手架到全局 npm i create-react-app -g2）安装mobx 2.1进行配置文件抽离 npm run eject 2.2 安装mobx和mobx-react这两个包npm i mobx mobx-react（mobx:状态管理工具）（mobx-react是做数据分片和数据获取）3）.配置装饰器npm i babel-plugin-transform-decorators-legacy -D @babel/preset-en...
2021-11-04 11:27:31
497
原创 react的路由配置和路由嵌套
也是基于我这篇《用react的路由写一个简单的导航》文章的延伸：https://blog.youkuaiyun.com/qq_42505615/article/details/121118546?spm=1001.2014.3001.5501路由配置：1.指定路由模式，引入HashRouterps：咱们默认用的是 BrowserRouter2.精确url匹配（exact）例如:我们想把home作为默认的显示页面 <Nav></Nav> .
2021-11-04 01:07:59
624
原创 React通过url传参和通过路由传参
是基于我写的上一篇文章《用react的路由写一个简单的导航》上面扩展出来的，朋友们可以去康康。https://blog.youkuaiyun.com/qq_42505615/article/details/121118546先看看我们需要得到的效果：点击【姓名007】，咱们可以进去看到007的其他详细信息。1.咱们先创建一个叫做 RoleDetail.js的文件，代码如下：import React, { Component } from 'react';class RoleDe..
2021-11-04 00:31:30
3399
原创 用react的路由写一个简单的导航
1.下载npm install react-router-dom -D2.使用规则import{BrowserRouter as Router, // 相当于一个容器Link, // 相当于a标签Route // 具体的路由}from 'react-router-dom'3.现在我们用路由来写一个简单的页面吧~效果如下~点击这个选项和出现不同的页面。咱们先把基本的文件夹给创建好。Component=>Nav=>Nav.cssC...
2021-11-03 16:57:06
934
5
原创 React中fetch和axios的简单使用
fetch的使用 ：废话不多说，我们先看看文档（看不懂也无所谓的OAO！！）文档：https://www.npmjs.com/package/whatwg-fetch1.安装 cd到你创建react项目的目录，在终端输入：npm install whatwg-fetch --save2. npm start3.在public下面创建一个叫做 user.json 的文件，代码如下：[ { "stuNo":"007", "stuN...
2021-11-02 19:21:29
700
原创 React的传值——Context的使用方法
一个 React 组件可以订阅 context 的变更，此组件可以让你在函数式组件中可以订阅 context。 咱们先说一下Context的概念。Context 提供了一个无需为每层组件手动添加 props，就能在组件树间进行数据传递的方法。 在使用它之前，我们可以简单的这样理解： Cotext:容器组件 —— 类似于淘X，JD这样的平台 Provider(生产者) —— 卖家（无数个） Consumer(消费者) ...
2021-11-02 18:30:21
566
原创 学习React值得一看的文章
1.React快速生成组件的快捷键(Vscode编辑器) 作者：洪洪呀https://blog.youkuaiyun.com/H_hongai/article/details/1088245622.React中constructor(props){}究竟是什么，以及super(props)与super() 作者：陈亚https://www.cnblogs.com/chenyablog/p/12251414.html3.whatwg-fetchhttps://www.npmjs.com/pa...
2021-11-02 18:01:48
283
原创 受控组件和非受控组件
~ 在 HTML 中，表单元素（如<input>、<textarea>和<select>）通常自己维护 state，并根据用户输入进行更新。而在 React 中，可变状态（mutable state）通常保存在组件的 state 属性中，并且只能通过使用setState()来更新。我们可以把两者结合起来，使 React 的 state 成为“唯一数据源”。渲染表单的 React 组件还控制着用户输入过程中表单发生的操作。被 R...
2021-11-02 12:44:43
183
原创 匿名插槽和具名插槽的简单使用
插槽的概念：插槽即：ReactDOM.createPortal(child, container) ，由ReactDom提供的接口。 可以实现将子节点渲染到父组件DOM层次结构之外的DOM节点。分为两种：匿名插槽和具名插槽。先说第一种匿名插槽：1.咱们在src目录下创建一个叫SlotTest.js 的文件，代码如下：import React, { Component } from 'react';class SlotTest extends Component { rende.
2021-11-01 22:54:48
404
原创 React中state的更新可能是异步的？
咱们先说一下state的概念，React中我们用state来进行组件内部的状态（数据）管理,可以用this.state.属性名获取状态。但是我们要修改组件内部的状态的话，不能直接用 this.state.属性名=值这样的写法。这样写虽然状态值被修改了，我们的页面却不会重新渲染。下面我们通过一个简单的计数器的小案例来加深理解：我们想要达到的效果是：点击按钮，count的值从0变为3。1.在src目录下先创建一个名为 StateTest.js 的文件，代码如下：import React,
2021-11-01 22:29:19
949
原创 用Chrome浏览器配置react开发者工具
手把手脚把脚教学。1.首先我们需要打开一个神奇的网址https://chrome.zzzmh.cn/info?token=fmkadmapgofadopljbjfkapdkoienihi2.咱们就点击【推荐下载】3.咱们把这个文件解压4.打开文件，把箭头指的那个文件移到chrome浏览器对应的位置5.这个对应的位置就是：再点击出来的【更多工具】=>【扩展程序】6.就是如下的界面，记得一定要把开发者模式打开再把绿色的文件拖到紫色区域内，然后点击确定...
2021-11-01 15:24:25
9341
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人