react,hooks中useState,useEffect,useMemo的使用

import React, {
      useEffect, useState, useMemo } from 'react';

useMemo 使用(相当与vue的计算属性 Computed )

const nextBtnText = useMemo(() => {
     
    if (step == 0) {
     
      return '下一步,填写库存信息';
    } else if (step == 1) {
     
      return '下一步,填写关联商品';
    }
  }, [step]);
  使用
  <Button type="primary" onClick={
     handleForm1}>
            {
     nextBtnText}
          </Button>

useState使用 (相当于vue里面的state)

//定义
const [checkedArr, setCheckedArr] = useState([ ]); 
//一个数组中删除一个元素
 setColorObj(checkedArr.splice(1, i));
 //一个数组中增加一个元素
setCheckedArr([...checkedArr, colorObj[i]]);
//一个数组中修改一个元素
 checkedArr[1][name] = value;
 setCheckedArr([...checkedArr]);

useEffect 使用 (异步操作在里面进行)

// 获取品牌和分类列表
  useEffect(() => {
     
    initBrand();
    initKind();
    initSeries();
  }, []);  //  [] 刚进行页面执行一次

你可能感兴趣的:(react)