React问题记录

1.class类组件中使用redux

存放state 修改state方法 reducer.js 

const defaultState = {
  isCanDownload: false
}

export default (state = defaultState, { type, value }) => {
  switch (type) {
    case 'setIsCanDownLoad':
      return {
        ...state,
        isCanDownload: value
      }
  }
}

组件a.js中

import React, { Component } from 'react' ;
class A extends B {
  //可以通过this.props使用redux中变量
  const { isCanDownload } = this.props;
}

const stateToProps = (state) => {
  return {
    isCanDownload: state.isCanDownload,
  }
}

export default connect(stateToProps, null)(A)

组件b.js中修改redux中isCanDownload变量

import { setIsCanDownLoad } from '@/redux/actionCreators'// 引入修改数据模块方法

function B(props) {
  const [meta, setMeta] = useState({})
  if(判断条件) {
    // props调用
    props.setIsCanDownLoad(true)
  }
}
// 注入props中
const dispatchToProps = (dispatch) => {
  return {
    setIsCanDownLoad(data) {
      dispatch(setIsCanDownLoad(data))
    }
  }
}
export default connect(null, dispatchToProps)(B)