我对酶的浅浅渲染只返回了道具。为什么会这样?
班级:
import React, { Component } from "react";
import { Link } from "react-router-dom";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { withTranslation } from "react-i18next";
import { loginUser } from "./actions";
import TextInput from "./textInput";
class Login extends Component {
constructor(props) {
super(props);
this.state = {
email: "",
password: "",
};
}
handleSubmit = e => {
e.preventDefault();
this.props.loginUser(this.state.email, this.state.password);
};
handleChange = event => {
const { value } = event.target;
const { name } = event.target;
this.setState({
[name]: value,
});
};
render() {
const { t } = this.props;
return (
<form onSubmit={this.handleSubmit}>
<TextInput
label="Email"
value={this.state.email}
handleChange={this.handleChange}
/>
<button action="submit">
{t("keywords.appRelated.login")}
</button>
<Link to="/recover-password" className="forgot-password">
{t("password.forgot")}
</Link>
</form>
);
}
}
function mapStateToProps(state) {
return {
authenticated: state.authenticated,
};
}
function mapDispatchToProps(dispatch) {
return bindActionCreators({ loginUser }, dispatch);
}
export default connect(mapStateToProps, mapDispatchToProps)(withTranslation()(Login));
测试:
const setUp = loginUser => {
const initialState = {
authenticated: true
},
};
const store = testStore(initialState);
const wrapper = shallow(
<I18nextProvider i18n={i18n}>
<Provider store={store}>
<Router history={history}>
<Login loginUser={loginUser} />
</Router>
</Provider>
</I18nextProvider>
);
beforeEach(() => {
wrapper = setUp(loginUser);
});
当我console.debug(wrapper)我得到这个:
<ContextProvider value={{...}}>
<Provider store={{...}}>
<Router history={{...}}>
<Connect(withI18nextTranslation(Login)) loginUser={[Function: mockConstructor]} />
</Router>
</Provider>
</ContextProvider>