状态管理库之 zustand

最新推荐文章于 2024-05-17 13:52:13 发布
最新推荐文章于 2024-05-17 13:52:13 发布
阅读量894 收藏 23
点赞数 26
文章标签： javascript 前端 typescript reactjs react.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_68076330/article/details/135583774
版权

感觉跟 pinia 有点像…

在这里插入图片描述

一、基本使用

1.1 编写、组织代码

  • store

    • appleStore.ts
    const { create } from 'zustand'
type AppleStateType = {
    price:number,
    count:number,
    increment:()=>void,
    decremnent:()=>void,
    getTotal:()=>number
}
const useAppleStore = create<AppleStateType>()((set,get)=>({
     // 状态
     price:7.0,
     count:10,
     //动作
     increment(){
         set(state =>({
             ...state,
             count:state.count + 1
         }))
     },
     decrement(){
         set(state=>({
             ...state,
             count:state.count - 1
         }))
     },
     getTotal(){
         return get().price * get().count
     }
}))
export default useAppleStore

  • 第一层不需要解构

  • set 中传入箭头函数，箭头函数返回一个对象，set 为设置状态

  • get 为获取当前状态

  • ts 语法中在泛型后面加上一个()

1.2 使用

  • App.tsx
import useAppStore from './store/appleStore'

const Child1 = ()=>{
    const price = useAppleStore(state=>state.price)
    const count = useAppleStore(state=>state.count)
    const increment = useAppleStore(state=>state.increment)
    const decrement = useAppleStore(state=>state.decrement)
    const getTotal = useAppleStore(state=>state.getTotal)
    
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>数量：{count}</h2>
        <h3>金额：{getTotal()}</h3>
        <button onClick={decrement}>-1</button>
        <button onClick={increment}>+1</button> 
       </>
    )
}

const App = ()=>{
    return(
    	<Child1 />
    )
}

二、异步

2.1 编写、组织代码

  • store

    • appleStore.ts
    const { create } from 'zustand'
type AppleStateType = {
    price:number,
    count:number,
    increment:()=>void,
    decremnent:()=>void,
    getTotal:()=>number,
    doubleCount:()=>Promise<undefined>
}
const useAppleStore = create<AppleStateType>()((set,get)=>({
     // 状态
     price:7.0,
     count:10,
     //动作
     increment(){
     },
     decrement(){
     },
     getTotal(){
     },
    async doubleCount(){
        const rate = await Promise.resolve(2)
        set(state=>({
            ...state,
            count:state.count * rate
        }))
    }
}))
export default useAppleStore

2.2 使用

  • App.tsx
import useAppStore from './store/appleStore'

const Child1 = ()=>{
    const price = useAppleStore(state=>state.price)
    const count = useAppleStore(state=>state.count)
    const increment = useAppleStore(state=>state.increment)
    const decrement = useAppleStore(state=>state.decrement)
    const getTotal = useAppleStore(state=>state.getTotal)
    const doubleCount = useAppleStore(state=>state.doubleCount)
    
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>数量：{count}</h2>
        <h3>金额：{getTotal()}</h3>
        <button onClick={decrement}>-1</button>
        <button onClick={increment}>+1</button> 
        <button onClick={doubleCount}>*2</button> 
       </>
    )
}

const App = ()=>{
    return(
    	<Child1 />
    )
}

三、immer 中间件

3.1 安装

  • 安装：npm i immer

3.2 使用

  • store

    • appleStore.ts
      • 包裹 create 后面
      • set 中返回代码块，不是对象
      • 使用 immer 之后直接覆盖就行，不需要重新创造一个对象
    const { create } from 'zustand'
import {immer} from 'zustand/middleware/immer'
type AppleStateType = {
    price:number,
    count:number,
    increment:()=>void,
    decremnent:()=>void,
    getTotal:()=>number,
    doubleCount:()=>Promise<undefined>
}
const useAppleStore = create<AppleStateType>()(immer(
    (set,get)=>({
         // 状态
         price:7.0,
         count:10,
         //动作
         increment(){
             set(state=>{state.count += 1})
         },
         decrement(){
             set(state=>{state.count -= 1})
         },
         getTotal(){
         },
        async doubleCount(){
            const rate = await Promise.resolve(2)
            set(state=>{count *= rate})
        }
    })
))
export default useAppleStore

四、useShallow

4.1 编写代码

  • store

    • appleStore.ts
    const { create } from 'zustand'
import {immer} from 'zustand/middleware/immer'
type AppleStateType = {
    price:number,
    count:number,
    color:string,
    increment:()=>void,
    decremnent:()=>void,
    getTotal:()=>number,
    doubleCount:()=>Promise<undefined>
}
const useAppleStore = create<AppleStateType>()(immer(
    (set,get)=>({
         // 状态
         price:7.0,
         count:10,
         color:red,
         //动作
         increment(){
             set(state=>{state.count += 1})
         },
         decrement(){
             set(state=>{state.count -= 1})
         },
         getTotal(){
         },
        async doubleCount(){
            const rate = await Promise.resolve(2)
            set(state=>{count *= rate})
        }
    })
))
export default useAppleStore

4.2 使用

  • App.tsx
    • 注意：const {price,color} = useAppleStore()
      • 表示获取到了每一项，虽然只解构出来了 price 和 color
        • 意味着，在 Child1 组件中对 store 中的 count 等其他属性进行刷新，那么 Child2 组件也会进行刷新
import useAppStore from './store/appleStore'

const Child2 = ()=>{
    const {price,color} = useAppleStore()
    
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>颜色：{color}</h2>
       </>
    )
}

const App = ()=>{
    return(
    	<Child2 />
    )
}
  • App.tsx
    • 让 useAppleStore 传入一个箭头函数，箭头函数返回一个对象
    • 使用 useShallow 包裹箭头函数
import {useShallow} from 'zustand/react/shallow'
import useAppStore from './store/appleStore'

const Child2 = ()=>{
    const {price,color} = useAppleStore(useShallow(state=>({
        price:state.price,
        color:state.color
    })))
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>颜色：{color}</h2>
       </>
    )
}

const App = ()=>{
    return(
    	<Child2 />
    )
}

五、调试工具

5.1 前提

  • 安装扩展插件：redux-devtools

5.2 使用

  • store

    • appleStore.ts
      • 使用 devtools 进行包裹
        • 第二个参数为配置选项
          • 能否被观察
          • 名称定义
    const { create } from 'zustand'
import {immer} from 'zustand/middleware/immer'
import {devtools} from 'zustand/middleware/immer'
type AppleStateType = {
    price:number,
    count:number,
    color:string,
    increment:()=>void,
    decremnent:()=>void,
    getTotal:()=>number,
    doubleCount:()=>Promise<undefined>
}
const useAppleStore = create<AppleStateType>()(immer(
    devtools(
        (set,get)=>({
             // 状态
             price:7.0,
             count:10,
             color:red,
             //动作
             increment(){
                 set(state=>{state.count += 1})
             },
             decrement(){
                 set(state=>{state.count -= 1})
             },
             getTotal(){
             },
            async doubleCount(){
                const rate = await Promise.resolve(2)
                set(state=>{count *= rate})
            }
        })
    ,{enabled:true,name:'Apple Store'})
))
export default useAppleStore

六、持久化存储

6.1 中间件的顺序

  • immer
    • devtools
      • 参数
        • 回调：返回一个状态
        • 配置对象
          • 默认情况下存储到 localStorage
          • name 设置 key
      • subscribeWithSelector
        • persist(set、get 的回调,{name:‘…’})

6.2 全部持久化存储

  • store

    • appleStore.ts
    const { create } from 'zustand'
import {immer,persist} from 'zustand/middleware/immer'
import {devtools} from 'zustand/middleware/immer'
type AppleStateType = {
}
const useAppleStore = create<AppleStateType>()(immer(
    devtools(
     persist(
        (set,get)=>({
             // 状态
             price:7.0,
             count:10,
             color:red,
             //动作
             increment(){
                 set(state=>{state.count += 1})
             },
             decrement(){
                 set(state=>{state.count -= 1})
             },
             getTotal(){
             },
            async doubleCount(){
                const rate = await Promise.resolve(2)
                set(state=>{count *= rate})
            }
        })
     ,{name:'myAllpeStore'})
    ,{enabled:true,name:'Apple Store'})
))
export default useAppleStore

6.3 仅存储指定属性

  • 配置选项中增加 partialize:(state)=>({price:state.price})

    • 返回哪个状态就保存哪一个状态
    • 只对 price 进行持久化保存

  • store

    • appleStore.ts
    const { create } from 'zustand'
import {immer,persist} from 'zustand/middleware/immer'
import {devtools} from 'zustand/middleware/immer'
type AppleStateType = {
}
const useAppleStore = create<AppleStateType>()(immer(
    devtools(
     persist(
        (set,get)=>({
             // 状态
             price:7.0,
             count:10,
             color:red,
             //动作
             increment(){
                 set(state=>{state.count += 1})
             },
             decrement(){
                 set(state=>{state.count -= 1})
             },
             getTotal(){
             },
            async doubleCount(){
                const rate = await Promise.resolve(2)
                set(state=>{count *= rate})
            }
        })
     ,{name:'myAllpeStore',partialize:(state)=>({price:state.price})})
    ,{enabled:true,name:'Apple Store'})
))
export default useAppleStore

6.4 指定某些属性不存储

  • 仍然借助 partialize

    • 对应箭头函数返回一个对象
      • fromEntries：将 [ [key,value] ] 变成对象的形式 { key:value}
        • entries：将对象的 key 和 value 整合到一个元组中，再将所有的元组加入到数组中进行返回(二维数组)

  • store

    • appleStore.ts
      • 指定不要 price
    const { create } from 'zustand'
import {immer,persist} from 'zustand/middleware/immer'
import {devtools} from 'zustand/middleware/immer'
type AppleStateType = {
}
const useAppleStore = create<AppleStateType>()(immer(
    devtools(
     persist(
        (set,get)=>({
        })
     ,{name:'myAllpeStore',partialize:(state)=>
      	Object.fromEntries(
        	Object.entries(state).filter(([key])=>!['price'].includes(key))
        )
      })
    ,{enabled:true,name:'Apple Store'})
))
export default useAppleStore

6.5 指定存储位置

  • 在配置选项中进行配置

  • store

    • appleStore.ts
    const { create } from 'zustand'
import {immer,persist} from 'zustand/middleware/immer'
import {devtools} from 'zustand/middleware/immer'
type AppleStateType = {
}
const useAppleStore = create<AppleStateType>()(immer(
    devtools(
     persist(
        (set,get)=>({
        })
     ,{name:'myAllpeStore',partialize:(state)=>
      	Object.fromEntries(
        	Object.entries(state).filter(([key])=>!['price'].includes(key))
        ),storage:createJSONStorage(()=>sessionStorage)
      })
    ,{enabled:true,name:'Apple Store'})
))
export default useAppleStore

七、subscribe

7.1 基本使用

  • App.tsx
    • 问题所在
      • 因为 Child2 组件中使用了 count，因此当 Child1 中更新了 count 之后，Child2 会重新渲染
      • Child2 依赖于 count 的值来进行渲染判断，但是其实没有必要每次都渲染的，因为 count 的值还是 < 7，直接返回上一次的"有点少"就够了
import {useShallow} from 'zustand/react/shallow'
import useAppStore from './store/appleStore'

const Child2 = ()=>{
    const {price,color} = useAppleStore(useShallow(state=>({
        price:state.price,
        color:state.color,
        count:state.count
    })))
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>颜色：{color}</h2>
        <h1>{count > 7 :'很多':'有点少'}</h1>
       </>
    )
}

const App = ()=>{
    return(
    	<Child2 />
    )
}
  • 解决方案：使用订阅机制
    • 会执行代码，但是不会让组件二重新渲染
    • 要求只订阅一次：使用 useEffect
    • 定义变量 text 设置文字
import {useShallow} from 'zustand/react/shallow'
import {useEffect} from 'react'
import useAppStore from './store/appleStore'

const Child2 = ()=>{
    const [text,setText] = useState('有点少')
    const {price,color} = useAppleStore(useShallow(state=>({
        price:state.price,
        color:state.color,
    })))
    useEffect(()=>{
       const cancelSubscribe = useAppleStore.subscribe((newState,prevState)=>{
        console.log('状态改变——这里执行')
        if(state.count >= 7 && prevState.count < 7){
            setText('很多')
        }else if(state.count < 7 && prevState.count >= 7){
            setText('太少')
        }
    })
       return cancelSubscribe
    },[])
   
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>颜色：{color}</h2>
        <h1>{text}</h1>
       </>
    )
}

const App = ()=>{
    return(
    	<Child2 />
    )
}

7.2 监听指定状态

  • 实现颗粒度更小的监听

  • 需要添加中间件：subscribeWithSelector

  • store

    • appleStore.ts
    const { create } from 'zustand'
import {immer,persist,subscribeWithSelector} from 'zustand/middleware/immer'
import {devtools} from 'zustand/middleware/immer'
type AppleStateType = {
}
const useAppleStore = create<AppleStateType>()(immer(
    devtools(
        subscribeWithSelector(
        	 persist(
                (set,get)=>({
                })
             ,{name:'myAllpeStore',partialize:(state)=>
                Object.fromEntries(
                    Object.entries(state).filter(([key])=>!['price'].includes(key))
                )
              })
        )
    ,{enabled:true,name:'Apple Store'})
))
export default useAppleStore

  • App.tsx

    • 开始订阅的时候也要执行一次
    • 设置变量
import {useShallow} from 'zustand/react/shallow'
import {useEffect} from 'react'
import useAppStore from './store/appleStore'

const Child2 = ()=>{
    const [text,setText] = useState('有点少')
    const {price,color} = useAppleStore(useShallow(state=>({
        price:state.price,
        color:state.color,
    })))
    useEffect(()=>{
       const cancelSubscribe = useAppleStore.subscribe(
       	state=>state.count,
        (count,prevCount)=>{
            if(count >= 7 && (prevCount < 7 || count === prevCount)){
                setText('很多')
            }else if(count < 7 && (prevCount >= 7 || count === prevCount)){
                setText('太少')
            }
        },
        { equalityFn:shallow,
          fireImmediately:true
        }
       )
       return cancelSubscribe
    },[])
   
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>颜色：{color}</h2>
        <h1>{text}</h1>
       </>
    )
}

const App = ()=>{
    return(
    	<Child2 />
    )
}

八、getState、setState

8.1 使用场景

  • 只需要在一个组件中使用修改状态的动作，不需要其他组件实现，不放在统一的位置

8.2 使用

  • App.tsx
import useAppStore,{decrement,increment,getTotal,doubleCount} from './store/appleStore'

const Child1 = ()=>{
    const price = useAppleStore(state=>state.price)
    const count = useAppleStore(state=>state.count)
    // const increment = useAppleStore(state=>state.increment)
    //const decrement = useAppleStore(state=>state.decrement)
   // const getTotal = useAppleStore(state=>state.getTotal)
   // const doubleCount = useAppleStore(state=>state.doubleCount)
    const myLocalAction = ()=>{
        useAppStore.setState((state)=>{state.count += 5})
    }
    return(
    	<>
        <h1>单价：{price}</h1>
        <h2>数量：{count}</h2>
        <h3>金额：{getTotal()}</h3>
        <button onClick={decrement}>-1</button>
        <button onClick={increment}>+1</button> 
        <button onClick={doubleCount}>*2</button> 
		<button onClick={myLocalAction}>Child1 独有的方法</button>
       </>
    )
}

const App = ()=>{
    return(
    	<Child1 />
    )
}

8.3 简化代码

  • 将动作写在外边
const { create } from 'zustand'
import {immer,persist} from 'zustand/middleware/immer'
import {devtools} from 'zustand/middleware/immer'
type AppleStateType = {
}
const useAppleStore = create<AppleStateType>()(immer(
    devtools(
     persist(
        (set,get)=>({
        })
     ,{name:'myAllpeStore',partialize:(state)=>
      	Object.fromEntries(
        	Object.entries(state).filter(([key])=>!['price'].includes(key))
        ),storage:createJSONStorage(()=>sessionStorage)
      })
    ,{enabled:true,name:'Apple Store'})
))
export default useAppleStore
export const increment =()=>{
    useAppleStore.setState((state)=>{state.count+=1})
}
export const decrement =()=>{
    useAppleStore.setState((state)=>{state.count-=1})
}
export const getTotal =()=>{
    return useAppleStore.getState().price * useAppleStore.getState().count
}
export const doubleCount = async ()=>{
    const rate = await Promise.resolve(2)
    useAppleStore.setState((state)=>{state.count *= rate})
}
原来是有理数
关注
  • 26
    点赞
  • 踩
  • 23
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
zustand-persist:持久和补水状态
05-05
是一个小型，快速且可扩展的状态管理解决方案。 该库受启发。 欢迎捐款 $ npm install zustand-persist $ yarn add zustand-persist 在这里尝试 中间件 // if in react native // import AsyncStorage from '@...
zustand：:bear_face:在React中承担状态管理的必要性
02-27
一种小型，快速且可扩展的功能块状态管理解决方案。 有一个基于钩子的舒适的api，不是样板化或自以为是的，但仍然足以使它显式且类似于通量。 不要忽略它，因为它很可爱。 它有很多利爪，花了很多时间来处理常见的...
react状态管理器-zustand
小帅の技术博客
09-13 2264
特性 不需要像redux那样在最外层包裹一层高阶组件，只绑定对应关联组件即可（当在其他组件/方法修改状态后，该组件会自动更新） 异步处理也较为简单，与普通函数用法相同 支持hook组件使用、组件外使用 提供middleware拓展能力（redux、devtools、combine、persist） 可通过 https://github.com/mweststrate/immer 拓展能力（实现嵌套更新、日志打印） 先来看看用法 创建 store // store import create from
轻量级的状态管理解决方案-zustand
qq_38629292的博客
11-06 1092
状态管理在现在的前端项目成为了必不可少的环节，三大框架也相继推出了自己的状态管理工具。当然也有一些非常优秀的第三方状态管理工具，比如：flux、mobx、dva、zustand等，今天我们就来了解下这款轻量级的状态管理工具-zustand。
React项目中使用zustand状态管理详细教程
闪电⚡之王的博客简介
10-25 1049
zustand是一个用于状态管理的小巧而强大的库，它与React非常兼容。以下是使用zustand在Reactzustand首先，你需要安装zustand。你可以使用npm或yarn安装它：使用npm在你的React应用中，创建一个状态管理器，通常将其定义为一个自定义的Hook。状态管理器是用来存储和管理应用的状态数据的地方。在你的React组件中导入并使用useStore钩子来访问和修改状态。useStore钩子将会管理你的状态，而你可以在任何需要访问状态的组件中导入并使用它。
[React] Zustand状态管理库
959
10-02 3859
React之状态管理器Zustand
Zustand 状态管理
Ly
01-10 1057
Zustand状态管理快速入门，Zustand Immer Middleware， Zustand中的selector，从store中抽离StateCreator，使用persist浏览器本地保存 State，使用shallow安全返回多个状态selector，使用 subscribeWithSelector，Zustand中使用devtools调试工具，Zustand中使用async异步方法。
zustand状态管理源码解析（一）
weixin_37764929的博客
06-17 564
  本次我们先从3.x版本解读，4.x版本作者还在rc阶段，等最终发布后我们在继续追加4.x版本的改动解析；   这个工具库相对来说很简单，我们直接使用 项目中的使用办法   在使用我们对于create函数的使用做一个详细的说明，我们解读一下源码对于create函数的描述   关于createState类型定义的描述有很多，本期简单的讲用法；   我们可以传递一个函数类型的参数，里面包含了，返回一个useStore的hooks，在react组件中通过可以选择性的获取对应store切片，下面我们就看看这些是怎
Zustand：简化状态管理的JavaScript库
lostdeer
04-18 324
Zustand是一个小巧而强大的状态管理库，专为React应用程序设计。它采用了hook的概念，使得状态管理变得简单而直观。轻量级：Zustand的包大小较小，对于性能和加载时间来说是一个优势。简单易用：通过使用简洁的API，Zustand使状态管理变得直观且容易上手。无需额外依赖：Zustand不需要依赖其他复杂的库或工具，只需使用React即可。性能优化：Zustand内部采用了一些优化策略，确保状态更新的性能最佳。
数据流管理、状态管理库：flux、redux、mobx、dva、vuex、zustand、valtio、recoil、jotai
qq_37819292的博客
11-02 567
- 单向数据流、中心化管理、函数式：redux、zustand、dva等 - 响应式、集中式管理：mobx、valtio、vuex等 - 原子状态模式、分散管理：recoil、jotai等
Zustand 和 React 上下文状态管理
ikxin的博客
04-21 1013
Zustand 是客户端全局状态管理的一个很棒的库。它简单、快速，并且包大小小。然而，有一件事我不一定喜欢它：这些 Store 是全局性的。但这不是全局状态管理的重点吗？要使该状态在您的应用程序中随处可用。不过当我回顾过去几年中使用 zustand 的情况时，我意识到，更多时候我需要在全局范围内将某些状态提供给一个组件子树，而不是整个应用程序。使用 zustand，完全可以（甚至可以鼓励）按功能创建多个小型存储。那么，如果我只需要在仪表板路由中使用仪表板过滤器存储，为什么还要在全局范围内使用它呢？
fira：React hooks中心状态管理解决方案-zustand与redux-toolkit的createSlice的最小API的融合
02-13
菲拉React Hooks为中心的状态管理解决方案-zustand与redux-toolkit的createSlice的最小API的融合
zustand-provider:具有SSR，Storybook等动态初始状态的Zustand
04-16
模板js :clipboard: JavaScript的模板存储库。 JavaScript的模板存储库。 :clipboard: import { returnOne } from "template-js" ;returnOne ( ) ; // 1目录 特征特征你可以做什么 :keycap_1: 功能1 你能行的 :...
使用代理跟踪状态使用情况。 优化 useState/useReducer、React Redux、Zustand 等的重新渲染。
06-08
使用代理进行 React Tracked 状态使用跟踪。优化 useState/useReducer、React Redux、Zustand 等的重新渲染。文档站点：...在 v1.6.0 之前，React Tracked 是一个库，用于替换全局状态的 React
ant design DatePicker日期选择框指定分钟的间隔minuteStep属性
最新发布
u010234868的专栏
05-17 195
在上面的例子中，DatePicker 将只允许用户以 15 分钟为间隔选择分钟。是 Ant Design 的 TimePicker时间选择框组件的一个属性。设置为 30，则用户可以选择以 30 分钟为间隔的分钟值。如果你想让分钟选项只能以 15 分钟为间隔选择，你可以将。
(Vue3+TS+Volar) 全局组件配置类型声明的最佳实践
从今年开始写写博客~~
05-14 231
简评：Volar官方全局组件的推荐写法，基于Volar，必须安装该插件，GlobalComponents是Volar专门为了解决全局组件类型而新增的类型接口。定义全局组件：使用GlobalComponents类型接口声明类型。
Vue.js的发展史（一）
2301_79683791的博客
05-15 755
Vue (发音为 /vjuː/，类似view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。来源官方解释-----简介 | Vue.js (vuejs.org)简单来说：Vue是一个属于JS的库，可直接引入一个JS文件就可以使用，与传统JS和JQuery框架不同，Vue的渐进式框架。
setImmediate不能在浏览器中执行
Keep trying, keep going
05-14 163
的延迟时间设置为 0，但实际的延迟可能会因浏览器的最小延迟时间限制而稍有不同。函数实现类似的效果。函数不是浏览器的标准 API，而。
安装 Tesseract 库
05-31
在其他 Linux 发行版中，也可以通过包管理器安装 Tesseract。 在 Windows 中，可以从 [Tesseract 的 GitHub 页面](https://github.com/UB-Mannheim/tesseract/wiki) 下载最新版本的安装包，然后按照提示完成安装。 ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值