class Parent extends Component<Props> {
constructor(props: Props) {
super(props);
// map state to json structure
this.state = {
data: {
image: ''
[...]
};
}
public componentWillMount() {
const dataProvider = new DataProvider(DataProvider.DBNAME);
dataProvider.loadData('somedoc')
.then((data: object) => this.setState({data}));
}
public render() {
const {data}: any = this.stat
return (<Child image={data.image} />);
}}
在我的子组件中,我将使用prop来发出新的请求以检索图像。问题在于componentWillMount方法中的prop为空。
interface IImageProps {
image: string;
}
Class Child extends Component<IImageProps> {
constructor(props: IImageProps) {
super(props);
}
public componentWillMount() {
console.log("image", this.props.image); // <-- it's allways empty
// do some async stuff
}
public render() {
console.log("image", this.props.image); // <-- the image information is shown
}}
我错过了什么?因为在render方法中我可以使用prop吗?我如何正确传递变量?