react知识点整理

最新推荐文章于 2022-09-08 14:26:44 发布
最新推荐文章于 2022-09-08 14:26:44 发布
阅读量814 收藏
点赞数
分类专栏： react
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45264424/article/details/115065486
版权

react知识点整理

创建项目

创建项目指令

npx create-react-app react-app

运行项目

cd my-app
npm start

基础语法

JSX表达式

1、{}中间可以使用表达式
2、{}中间表达式中可以使用JSX对象
3、属性和html内容一样都是用{}来插入内容

import React from "react";

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            title:"child1标题",
            isHot:false
        }
    }
    render() {
        const {title,isHot}=this.state
        let element = (
            <button>凉爽</button>
        )
        return (
            <div>
                {title}
                {isHot ? <button>炎热</button> : element}
            </div>
        )
    }
}

export default Child1

react 绑定class

  1. 直接动态绑定，没有判断条件的（有判断条件这样写的话iconfont 不会被渲染出来 ）
<i className={["iconfont"+" "+item.icon]} ></i>

2.有判断条件的

<i className={["iconfont ",isRed ?item.icon :'' ].join('')} ></i>

3.使用ES6 模板字符串

<i className={`iconfont ${isRed ?item.icon :'' }`} ></i>

react 绑定style

  <div style={{display: this.state.show ? "block" : "none", color:"red"}}>此标签是否隐藏</div>

react 条件渲染

方案一：

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            isHot:true,
        }
    }
    render() {
        const {isHot}=this.state
        let elementP=""
        if(isHot){
            elementP= <p>炎热</p>
        }else{
            elementP= <p>凉爽</p>
        }
        return (
            <div>
                {elementP}
            </div>
        )
    }
}

export default Child1

方案二：

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            title:"child1标题",
            isHot:true,
        }
    }
    ifFun() {
        if(this.state.isHot){
            return <p>炎热1</p>
        }else{
            return <p>凉爽1</p>
        }
    }
    render() {
        const {isHot}=this.state
        return (
            <div>
                {this.ifFun()}
            </div>
        )
    }
}

export default Child1

方案三：

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            isHot:true,
        }
    }
    render() {
        const {isHot}=this.state
        return (
            <div>
                {isHot ? <button>炎热</button> : <button>凉爽</button>}
            </div>
        )
    }
}

export default Child1

react 循环渲染

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            list:[{
                title:"标题一"
            },{
              title:"标题二"
            }]
        }
    }
    render() {
        const {list}=this.state
        return (
            <div>
                {
                    list.map((item,index)=>{
                        return <div key={index}>{item.title}</div>
                    })
                }
            </div>
        )
    }
}

export default Child1

react 绑定事件

方法一：

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
        }
    }
    clickHandle(){
        console.log("点击了")
    }
    render() {
        return (
            <div>
                <button onClick={()=>{this.clickHandle()}}>按钮</button>
            </div>
        )
    }
}

export default Child1

方法二：

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
        }
    }
    clickHandle(){
        console.log("点击了")
    }
    render() {
        return (
            <div>
                <button onClick={this.clickHandle.bind(this)}>按钮</button>
            </div>
        )
    }
}

export default Child1

双向数据绑定

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            value:"123"
        }
    }
    changHandle(e){
        this.setState({
            value:e.target.value
        },()=>{
            console.log(this.state.value)
        })
    }
    render() {
        const {value}=this.state
        return (
            <div>
                <input type="text" value={value} onChange={(e)=>{this.changHandle(e)}}/>
            </div>
        )
    }
}

export default Child1

state简写

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    constructor(props) {
        super(props)
        // this.state = {
        //     title:"child1标题",
        //     isHot:true,
        //     claName:"box",
        //     show:true,
        //     list:[{
        //         title:"标题一"
        //     },{
        //       title:"标题二"
        //     }],
        //     value:"123"
        // }
    }
    state = { 
    	title:"child1标题",
        isHot:true,
        claName:"box",
        show:true,
        list:[{
            title:"标题一"
        },{
            title:"标题二"
        }],
        value:"123"}

    render() {
        const {title,isHot,claName,list,value}=this.state
        return (
            <div>
            </div>
        )
    }
}

export default Child1

父子组件传参

父组件传值给子组件 （props）

父组件：

import logo from './logo.svg';
import './App.css';

//引入组件
import Child1 from "./components/child1";
import Child2 from "./components/child2";
function App() {
  return (
    <div className="App">
      <Child1 msg="这是父组件的消息"></Child1>
      <Child2></Child2>
    </div>
  );
}

export default App;

子组件：

import React from "react";
import "./index.scss"

class Child1 extends React.Component {
    state = { }
    clickHandle(){
        console.log(this.props.msg)
    }
    render() {
        const {}=this.state
        return (
            <div>
                <button onClick={()=>{this.clickHandle()}}>按钮</button>
            </div>
        )
    }
}

export default Child1

设置props默认值和数据类型限制

需要引入：import PropTypes from ‘prop-types’;

import React from "react";
import "./index.scss"
import PropTypes from 'prop-types';

class Child1 extends React.Component {
    state = { }
    render() {
        const {}=this.state
        return (
            <div>
                {this.props.name}
            </div>
        )
    }

}
//对标签属性进行类型、必要性的限制
Child1.propTypes = {
    name:PropTypes.string.isRequired, //限制name必传，且为字符串
    sex:PropTypes.string,//限制sex为字符串
    age:PropTypes.number,//限制age为数值
    speak:PropTypes.func,//限制speak为函数
}
//指定默认标签属性值
Child1.defaultProps = {
    sex:'男',//sex默认值为男
    age:18 //age默认值为18
}

export default Child1

简写方法：

import React from "react";
import "./index.scss"
import PropTypes from 'prop-types';


class Child1 extends React.Component {
    state = { }
//对标签属性进行类型、必要性的限制
    static propTypes = {
        name:PropTypes.string.isRequired, //限制name必传，且为字符串
        sex:PropTypes.string,//限制sex为字符串
        age:PropTypes.number,//限制age为数值
        speak:PropTypes.func,//限制speak为函数
    }
//指定默认标签属性值
    static defaultProps = {
        sex:'男',//sex默认值为男
        age:18 //age默认值为18
    }
    clickHandle(){
        console.log(this.props.msg)
    }
    render() {
        const {}=this.state
        return (
            <div>
                <button onClick={()=>{this.clickHandle()}}>按钮</button>
                {this.props.msg}
            </div>
        )
    }
}
export default Child1

子组件传值给父组件，父组件调用子组件方法

方法一：使用ref
父组件

import React from "react";
import "./index.scss"
import Child3 from "../child3"

class Child1 extends React.Component {
    constructor(props) {
        super(props);
        this.child = React.createRef();
    }
    state = { }
    clickHandle(){
        console.log(this.child.current.state.msg)
        this.child.current.child3Fun()
    }
    render() {
        const {}=this.state
        return (
            <div>
                <Child3  ref={this.child}></Child3>
                <button onClick={()=>{this.clickHandle()}}>点我获取子组件的参数</button>
            </div>
        )
    }

}

export default Child1

子组件

import React from "react";
class Child3 extends React.Component {
    state = {msg:"这是child3中的数据" }
    child3Fun(){
        console.log("这是child3中的方法")
    }
    render() {
        const {msg}=this.state
        return (
            <div>
                {msg}
            </div>
        )
    }
}

export default Child3

子组件调用父组件的方法

父组件

import React from "react";
import "./index.scss"
import Child3 from "../child3"

class Child1 extends React.Component {
    constructor(props) {
        super(props);
        this.child = React.createRef();
    }
    state = { }
    clickHandle(){
        console.log("这是父组件中的方法")
    }
    render() {
        const {}=this.state
        return (
            <div>
                <Child3  ref={this.child} clickHandle={this.clickHandle}></Child3>
            </div>
        )
    }
}


export default Child1

子组件

import React from "react";

class Child3 extends React.Component {
    state = {msg:"这是child3中的数据" }
    child3Fun(){
        this.props.clickHandle()
    }
    render() {
        const {msg}=this.state
        return (
            <div>
                {msg}
                <button onClick={()=>{this.child3Fun()}}> 3按钮</button>
            </div>
        )
    }
}


export default Child3

生命周期

旧生命周期


1. 初始化阶段: 由ReactDOM.render()触发---初次渲染
					1.	constructor()
					2.	componentWillMount()
					3.	render()
					4.	componentDidMount() =====> 常用一般在这个钩子中做一些初始化的事，例如：开启定时器、发送网络请求、订阅消息
2. 更新阶段: 由组件内部this.setSate()或父组件render触发
					1.	shouldComponentUpdate()
					2.	componentWillUpdate()
					3.	render() =====> 必须使用的一个
					4.	componentDidUpdate()
3. 卸载组件: 由ReactDOM.unmountComponentAtNode()触发
					1.	componentWillUnmount()  =====> 常用一般在这个钩子中做一些收尾的事，例如：关闭定时器、取消订阅消息
					
//组件将要挂载的钩子
componentWillMount(){
	console.log('Count---componentWillMount');
}

//组件挂载完毕的钩子
componentDidMount(){
	console.log('Count---componentDidMount');
}

//组件将要卸载的钩子
componentWillUnmount(){
	console.log('Count---componentWillUnmount');
}

//控制组件更新的“阀门”
shouldComponentUpdate(){
	console.log('Count---shouldComponentUpdate');
	return true
}

//组件将要更新的钩子
componentWillUpdate(){
	console.log('Count---componentWillUpdate');
}

//组件更新完毕的钩子
componentDidUpdate(){
	console.log('Count---componentDidUpdate');
}
//组件卸载完毕的钩子
componentWillUnmount(){
	console.log('Count---componentWillUnmount');
}

在这里插入图片描述

新生命周期


1. 初始化阶段: 由ReactDOM.render()触发---初次渲染
				1.	constructor()
				2.	getDerivedStateFromProps 
				3.	render()
				4.	componentDidMount() =====> 常用一般在这个钩子中做一些初始化的事，例如：开启定时器、发送网络请求、订阅消息
2. 更新阶段: 由组件内部this.setSate()或父组件重新render触发
				1.	getDerivedStateFromProps
				2.	shouldComponentUpdate()
				3.	render()
				4.	getSnapshotBeforeUpdate
				5.	componentDidUpdate()
3. 卸载组件: 由ReactDOM.unmountComponentAtNode()触发
				1.	componentWillUnmount()  =====> 常用一般在这个钩子中做一些收尾的事，例如：关闭定时器、取消订阅消息


//若state的值在任何时候都取决于props，那么可以使用getDerivedStateFromProps
static getDerivedStateFromProps(props,state){
	console.log('getDerivedStateFromProps',props,state);
	return null
}

//在更新之前获取快照
getSnapshotBeforeUpdate(){
	console.log('getSnapshotBeforeUpdate');
	return 'atguigu'
}

//组件挂载完毕的钩子
componentDidMount(){
	console.log('Count---componentDidMount');
}

//组件将要卸载的钩子
componentWillUnmount(){
	console.log('Count---componentWillUnmount');
}

//控制组件更新的“阀门”
shouldComponentUpdate(){
	console.log('Count---shouldComponentUpdate');
	return true
}

//组件更新完毕的钩子
componentDidUpdate(preProps,preState,snapshotValue){
	console.log('Count---componentDidUpdate',preProps,preState,snapshotValue);
}

在这里插入图片描述

路由

安装路由插件

npm install react-router-dom --save

ReactRouter三大组件：
Router：所有路由组件的根组件（底层组件），包裹路由规则的最外层容器。
属性：basename->设置跟此路由根路径，router可以在1个组件中写多个。
Route:路由规则匹配组件，显示当前规则对应的组件
Link:路由跳转的组件

路由配置

App.js:

import logo from './logo.svg';
import './App.css';

// 导入路由
import {
    BrowserRouter as Router,
    Switch,
    Route,
} from "react-router-dom";

//导入页面级组件
//登录
import Login from "./pages/Login";
//首页
import Index from "./pages/Index";
//数据管理
import System from "./pages/System";

function App() {
    return (
        <Router>
            <div> { /*路由配置*/}
                <Switch>
                    <Route path="/Login">
                        <Login/>
                    </Route>
                    <Route path="/Index">
                        <Index/>
                    </Route>
                    <Route path="/System">
                        <System/>
                    </Route>
                    <Route path="/">
                        <Login />
                    </Route>
                </Switch>
            </div>
        </Router>
    );
}

export default App;

子路由配置

某个页面下的js：

import React from "react";
import "./index.scss"
import {Layout} from 'antd';
import {
    Switch,
    Route,
    Link,
    withRouter
} from "react-router-dom";


//引入组件
import HeaderBar from "../../components/System/HeaderBar";
import LeftNav from "../../components/System/LeftNav";
//引入页面级组件 路由
//市场主体专题
import MarketTopics from "./MarketTopics";
// 楼宇厂房载体专题
import FloorTopics from "./FloorTopics";
//产业项目专题
import IndustryTopics from "./IndustryTopics";

const {Header, Sider, Content} = Layout;
class System extends React.Component {
    constructor(props) {
        super(props)
        this.state = {}
    }

    render() {
        return (
            <Layout>
                <Header><HeaderBar></HeaderBar></Header>
                <Layout>
                    <Sider><LeftNav></LeftNav></Sider>
                    <Content>
                        {/*配置子路由*/}
                        <Switch>
                            <Route path={`/System/FloorTopics`}>
                                <FloorTopics/>
                            </Route>
                            <Route path={`/System/MarketTopics`}>
                                <MarketTopics/>
                            </Route>
                            <Route path={`/System/IndustryTopics`}>
                                <IndustryTopics/>
                            </Route>
                            {/*默认显示的子路由*/}
                            <Route path={"/System"}>
                                <MarketTopics/>
                            </Route>
                        </Switch>
                    </Content>
                </Layout>
            </Layout>
        )
    }
}

export default withRouter(System)

路由传参(三种 推荐使用state传参)

方法一：params传参(刷新页面后参数不消失，参数会在地址栏显示)

路由页面：<Route path='/demo/:id' component={Demo}></Route>  //注意要配置 /:id
路由跳转并传递参数：
    链接方式：<Link to={'/demo/'+'6'}>XX</Link>
        或：<Link to={{pathname:'/demo/'+'6'}}>XX</Link>

    js方式：this.props.history.push('/demo/'+'6')  
        或：this.props.history.push({pathname:'/demo/'+'6'})
获取参数：this.props.match.params.id    //注意这里是match而非history

params传参(多个动态参数)

state={
    id:88,
    name:'Jack',
}
路由页面：<Route path='/demo/:id/:name' component={Demo}></Route>  
路由跳转并传递参数：
    链接方式：<Link to={{pathname:`/demo/${this.state.id}/${this.state.name}`}}>XX</Link>

    js方式：this.props.history.push({pathname:`/demo/${this.state.id}/${this.state.name}`})
获取参数：this.props.match.params     //结果 {id: "88", name: "Jack"}

方法二 query传参(刷新页面后参数消失)

路由页面：<Route path='/demo' component={Demo}></Route>  //无需配置
路由跳转并传递参数：
    链接方式：<Link to={{pathname:'/demo',query:{id:22,name:'dahuang'}}}>XX</Link>
    js方式：this.props.history.push({pathname:'/demo',query:{id:22,name:'dahuang'}})
获取参数： this.props.location.query.name

方法三 state传参( 刷新页面后参数不消失，state传的参数是加密的，比query传参好用)

路由页面：<Route path='/demo' component={Demo}></Route>  //无需配置
路由跳转并传递参数：
    链接方式： <Link to={{pathname:'/demo',state:{id:12,name:'dahuang'}}}>XX</Link> 
    js方式：this.props.history.push({pathname:'/demo',state:{id:12,name:'dahuang'}})
获取参数： this.props.location.state.name

编程式导航

1 push                props.history.push('/singer')

2 replace             props.history.replace({pathname:'/singer'})

3 go                  props.history.go(-1)  //返回

4 goback              props.history.goBack()   //返回

5 goforward           props.history.goForward()  //前进

打包

npm run build
前端老实人灬
关注
专栏目录
React 01 state props ref
weixin_58562753的博客
06-18 185
react 01 state props ref
React基础知识点个人笔记整理
wanghe1111_的博客
11-05 302
React react项目移植出现的问题 当把我的react项目移植到另一台电脑时，因为要npm install 安装依赖库，但是对于采用npm install会带来一些库的版本问题，当时找了很多方法才解决，解决方法就是很简单：是采用yarn包管理工具，yarn会自己解决一些库的版本问题，使得在新环境中不会因版本问题报错 1. react是什么 React是一个用于构建用户界面的js库， React主要作用是来写html页面，或构建web应用 从MVC角度，react仅仅是视图层V，也就是只负责视图的渲染，
react基础知识点整理
mondy592的博客
07-20 1297
react的优点: 1、React速度很快：它并不直接对DOM进行操作，引入了一个叫做虚拟DOM的概念，安插在 javascript逻辑和实际的DOM之间，性能好。 2、跨浏览器兼容：虚拟DOM帮助我们解决了跨浏览器问题，它为我们提供了标准化的API，甚至在IE8中都是没问题的。 3、一切都是component：代码更加模块化，重用代码更容易，可维护性高。 4、单向数据流：Flux是一个用...
React_整理
有道无术，术尚可求
01-05 213
1.React有那些优缺点？ 优点 1、React速度很快：它并不直接对DOM进行操作，引入了一个叫做虚拟DOM的概念，安插在javascript逻辑和实际的DOM之间，性能好。 2、跨浏览器兼容：虚拟DOM帮助我们解决了跨浏览器问题，它为我们提供了标准化的API，甚至在IE8中都是没问题的。 3、一切都是component：代码更加模块化，重用代码更容易，可维护性高。 4、单向数据流：Flu...
React整理（一）
Nana_Jia的博客
02-06 636
节流和防抖 节流（throttle）：基于时间的频率来进行抽样更改 防抖（debounce）：一段时间的不活动之后发布更改 state和props的区别 react state和props的区别 给setState传递一个对象和传递一个函数的区别 因为setState是异步合并更新的，所以setState传递一个对象，如果要更新那些依赖于当前的state的state时，不能确保每次的调用都是最新的state，导致给了我们一个错误的值。 而传递一个函数可以在函数访问到当前的state的值，确保他们是建立在另一
React基础整理
CrystalLee
07-31 219
前言：     休了两个月的假期，手头上的知识有点遗漏很多了，赶着在入职前复习一轮，正好把之前的东西做一个完整的归纳。【PS：所有的笔记都可能在日后做更新补充】 ============================================================================================= 一、搭建一个React环境基础【由于是在一台...
react框架知识点总结
serendipitymm的博客
11-30 1017
react recat基本概念 react是由facebook开发的 recat是一个专门用于构建用户界面的javascript库 为了解决页面更新dom加载慢的问题 所以推出的react这个js库 来高效的解决大型项目中的dom加载国漫页面渲染过慢的问题 recat特点 声明式设计:我们只需要告诉程序干什么 程序会自己帮我们完成 高效 灵活 组件化 单项数据流 发展史 2013年推出的 在13年9月份 就受到了市场的追捧 15年3月 推出了一个reactNative的技术(使用re
知识点整理_for_software.zip
01-17
《软件设计师一本通_精华知识点(重要必看).pdf》是针对软件设计领域的核心知识点进行系统整理的参考资料，旨在帮助学习者深入理解并掌握软件设计的关键概念和技术。这份压缩包中的文档涵盖了软件设计的多个重要方面...
入门级react面试题整理收藏(自己使用的资料).pdf
12-15
本文整理的 React 面试题涵盖了 React 的基础知识点，也包括一些高级的知识点，如合成事件、事件代理、高阶组件、Render props、Hooks 等。本文可以帮助读者更好地理解 React 的工作机制和使用方法，提高自己的 ...
React相关知识点
m0_56752010的博客
10-26 649
一、什么是 React? - 官方解释：用于构建用户界面的 JavaScript 库。是一个将数据渲染为 HTML 视图的开源 JavaScript 库。 - 1.发送请求获取数据 - 2.处理数据（过滤、整理格式等） - 3.操作 DOM 呈现页面 二、为什么要学？ - 原生 JavaScript 操作 DOM 繁琐，效率低；（DOM-API 操作UI） - 使用 JavaScript 直接操作 DOM ,浏览器会进行大量的重绘重排； - 原生 JavaScript 没有组件化编码方案，代码复用率低； 三
React基本知识点整理
weixin_44416058的博客
07-22 939
React中父子组件通信方式
react 安装与知识点整理（一）
Syh265的博客
12-29 400
react 知识点与安装
React知识点总结
wdhxs的博客
12-02 563
React知识点总结（一） 文章目录React知识点总结（一）一、React中keys的作用是什么？二、调用 setState 之后发生了什么？三、setState是同步还是异步？四、在连续多次调用异步的setState时，render被执行的情况是怎样的？ 一、React中keys的作用是什么？ React使用key来标识每个组件，相同的key为同一组件 建立一一对应的映射关系后，React在更新或者添加组件时就能迅速地找到key对应的组件进行对比更新或者添加组件。 二、调用 setState 之后发
React基础知识
weixin_47586598的博客
09-08 424
React基础知识
react 框架
szw19910的博客
12-27 157
安装 npx create-react-app my-app 启动 npm strat react jsx 入口 index.js react 原生对象 引入方式 import React form "react" 用React 创建一个节点,它是一个普通JS对象,用来描述真实元素 React.createElement("h1"null,“hell”) 有三个参数:1.节点类型,2.状态3.文本 react DOM 引入方式 import ReactDOM form "react-dom"
react学习总结2--基础（二）
mjzhang1993的博客
12-17 5891
react 学习总结–基础（二）说明 React 版本 ：”15.4.1” react-tap-event-plugin 版本： “^2.0.1” 1.数据流 在 React 中，数据流的流向是单向的–从父节点传递到子节点，因而组件是简单且易于把握的，他们只需从父节点获取props渲染即可 React 组件内部还具有自己的状态，这些状态只能在组件内修改，React组件本身
React之setState调用unmount组件报警告
hahahhahahahha123456的博客
11-09 869
最近公司比较忙,所以更新进度比较慢,一是因为要梳理以前的代码,二是因为赶进度!!! 这个问题也是机缘巧合碰到了,正赶上这周公司网络无缘无故抽风(很慢),然后那天在调试代码的时候忽然发现浏览器报了一个这样的Warning: warn.png   其实从字面上也大概可以了解个大概,是由于setState只能更新挂载完成的组件或者正在挂载的组件,那么定位这个BUG的第一步当然是先了解组件的生命...
React 基础知识点复习
weixin_40821790的博客
11-29 1820
react难点：组件怎么拆分？ 单一原则，只干一件事，功能简单，不复用不拆，考虑迭代 数据放在哪里？【数据】 props：数据传递 state：私有状态（用户输入、默认属性） 数据尽量给顶层组件 为什么用setState？ 因为虚拟dom没完成更新，且修改的是复制的state setState：在原来的基础上进行合并，异步，解决：this.setState（functi
耗时一个月，React 知识点万字大总结（超全超基础）
萌萌哒的瑞萌萌的博客
04-29 6697
React特点 React是一个将数据渲染为 HTML 视图 的 js 库 简单看来，React 框架主要功能体现在前端 UI 页面的渲染，包括性能优化以及操作简化等等方面。站在 mvc 框架的角度来看，React 操作 view 层的功能实现。 采用组件化模式、声明式编码、函数式编程，提高开发效率和组件复用性 它遵循从高阶组件到低阶组件的单向数据流。 在 React Native 中可以用 react 预发进行安卓、ios 移动端开发 使用虚拟 dom 和 diff 算法，尽量减少与真实 dom 的交互
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值