Question

由于我是meteor / react的新手，我无法弄清楚如何初始化我的状态变量。

我的问题是我想得到

my mongo collection通过来自react-meteor-data的createContainer（如here所述），
使用初始化的prop来初始化状态变量

但是构造函数中的prop是空的。只有当我调用“gotClicked”函数时，prop.allLists才会填充来自mongo的数据。

有谁知道为什么？我猜测数据是异步加载的，因此构造函数中的数据尚不可用。什么是获得数据的更好方法？

import React, {Component, PropTypes} from 'react';
import { createContainer } from 'meteor/react-meteor-data';
import {AllLists} from '../api/alllists.js'
export default class MyList extends Component {

    constructor(props) {
        super();

        console.log(props.allLists)
        console.log(this.props.allLists)
        //allLists is empty

        this.state = {
            lists: props.allLists
        }
    }

    gotClicked(){
        console.log(this.props.allLists)
        //allLists is filled
    }

    render() {
        return (
            <div className="container" onClick={this.gotClicked.bind(this)}>
            </div>
        );
    }
}

MyList.propTypes = {
   allLists: PropTypes.string.isRequired
}

export default createContainer(() => {
    return {
        allLists: AllLists.find({}).fetch()
    };
}, MyList);

Answer 1

你是对的，数据是异步加载的，它可能在构造函数中不可用。但是，在加载数据时，会再次评估传递给{$combination = current($combinations)} {$combination['quantity']}的回调函数，并自动更新组件的createContainer。

要捕获此更改，请在React组件中实现props函数。

componentWillReceiveProps

文档：https://facebook.github.io/react/docs/component-specs.html

meteor-reactjs：在构造函数集合中为空

1 个答案: