使用酶设置redux连接反应组件的状态

Question

import configureMockStore from 'redux-mock-store';
import NavBar from '../components/NavBar/NavBar';

const mockStore = configureMockStore(middlewares);
const store = mockStore(initialState);

wrapper = mount(
    <BrowserRouter> 
        <Provider store={store}>
            <NavBar {...props} />
        </Provider>
    </BrowserRouter> 
);

如何更新包装器中存在的NavBar组件的状态？

我尝试使用wrapper.setState({displayMenu:true})更新，但它没有更新，因为我认为包装器是组件与提供者的包装，所以NavBar的状态没有更新。

Answer 1

为了解决这个问题，你可以这样写：

import ConnectedNavBar, { NavBar } from '../components/NavBar/NavBar';

const wrapper = mount(
    <Provider store={store}>
        <ConnectedNavBar/>
    </Provider>
);

const navBarInstance = result.find(NavBar).instance() as NavBar;
navBarInstance.setState({displayMenu:true});

获取有关redax-component的信息

navBarInstance.props
navBarInstance.state

注意！注意组件是如何导入的

import ConnectedNavBar, { NavBar } from '../components/NavBar/NavBar';

并按如下方式导出redax组件：

export class NavBar extends Component<Props, State>{} 
/*...*/
export default connect<StateProps>(mapStateToProps)(NavBar);

我希望这能解决你的问题