,可以通过以下步骤实现:
下面是一个示例代码:
在Redux的store中定义globalState:
// store.js
import { createStore } from 'redux';
const initialState = {
globalState: null,
};
function reducer(state = initialState, action) {
switch (action.type) {
case 'UPDATE_GLOBAL_STATE':
return {
...state,
globalState: action.payload,
};
default:
return state;
}
}
const store = createStore(reducer);
export default store;
在Redux的action中创建更新globalState的动作:
// actions.js
export const updateGlobalState = (value) => ({
type: 'UPDATE_GLOBAL_STATE',
payload: value,
});
在需要导出值的组件中连接到Redux的store,并将globalState作为props传递给组件:
// MyComponent.js
import React from 'react';
import { connect } from 'react-redux';
const MyComponent = (props) => {
// 使用globalState进行操作
const { globalState } = props;
return (
<div>
<p>Global State: {globalState}</p>
</div>
);
};
const mapStateToProps = (state) => ({
globalState: state.globalState,
});
export default connect(mapStateToProps)(MyComponent);
这样,通过Redux的store和connect函数,就可以将globalState导出并使其成为全局可用的值。在需要使用globalState的组件中,可以通过props访问和操作它。
领取专属 10元无门槛券
手把手带您无忧上云