import {createStore} from 'redux';
import reducer from './reducer'

const store=createStore(reducer);


export default store;

const defaultState = {
  inputValue: '',
};
export default (state = defaultState, action) => {// NOSONAR
  try {
    if (action.type === 'change_input_value') {
      const newState = JSON.parse(JSON.stringify(state));
      if (action.inputValue) {
        newState.inputValue = action.inputValue;
      } else {
        newState.inputValue.nowMenuCode = '1';
      }
      // console.log('获取newValue111=== action', action);
      return newState;
    }
    if (action.type === 'update_select_menu') {// 更新被选中的内容
      const newState = JSON.parse(JSON.stringify(state));// state:获取现有的redux中的内容
      // newState.inputValue.nowMenu = action.value;// 将传入的参数更新到nowMenu标签中
      // console.log('获取newValue222=== action', action);
      newState.inputValue.nowMenuCode = action.value;// 将传入的参数更新到nowMenu标签中
      return newState;
    }
  } catch (e) {
    console.log('e', e);
  }
  return state;
}
store.getState() 获取状态

store.dispatch({type:'', data: ''}) 修改状态

// store进行订阅,当store进行变化时执行subscribe中的方法,状态变化时自动调回调函数
store.subscribe(() => {
    //可以把store.subscribe放到useEffect中
    ReactDOM.render(<APP/>, document.getElementById('root'))
})

容器组件connect()() 左边连接redux-store(store={store},需要通过上层的props传递,参数1为状态,参数2为操作状态的方法),右边连接UI组件

provider,给所有子组件传递store

Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐