React Native Function不返回

时间:2016-03-09 06:29:23

标签: javascript react-native

我的React Native应用程序$2y$13$Cn0gwiUfg2mq5Y3/V98aB.NZ4GJqjbwhvKlsSAOYkVNHKlWRmwZ1W中有一个页面,它根据ID的数组呈现滚动视图。我将此数组传递给另一个函数RepsPage,并尝试返回数组中每个项目的视图,但返回只是空的。我已经尝试过调试它,看起来数据库中的对象正在传递,并且肯定会显示内容,但它并没有使它成为返回函数的方法。我尝试了多次迭代(在Firebase查询中有返回功能),但似乎没有任何效果。附加代码:

renderRep

1 个答案:

答案 0 :(得分:1)

您的renderRep方法应设置状态而不是返回值。

像这样的东西。请注意我尝试编写这个' blind':

的事实
export default class RepsPage extends Component {
    construct() {
        this.state = {
            snapshots: []
        }
    }

    componentDidMount(){
        this.fetchRep('someid');
    }

    fetchRep(repID) {
        var rep = new Firebase('https://ballot-app.firebaseio.com/congressPerson');
        var nameView;
        var partyView;
        //entire function not executing?

        rep.orderByChild("bioguideId").equalTo(repID).on("child_added", (snapshot)=> {
            console.log(snapshot.val());
            this.setState({snapshots: [].concat(this.state.snapshots, [snapshot.val()])});
        });
    }

    renderRep() {
        return this.state.snapshots.map((snapshot)=>
            <View style={styles.tagContainer}>
                <Text>{snapshot.name}</Text>
                <Text>{snapshot.party}</Text>
            </View>
        );
    }

    render() {
        var user = this.props.user;
        var reps = user.representatives;

        return (
            <ScrollView
                automaticallyAdjustContentInsets={false}
                scrollEventThrottle={200}
                style={styles.scrollView}
            >
                { this.renderRep.bind(this) }
            </ScrollView>
        );
    }
}