为什么 React Native 地图功能无法正常工作？

Question

我正在尝试从 firebase firestore 检索数据。来自 firestore 的数据记录在控制台上，但在我使用组件时不显示。

renderList = () => {
        const { accounts } = this.props
        accounts && accounts.map((account) => {
            return (
                <View>
                    <Text>{account.accountName}</Text>
                    {console.log(account.accountName)}
                </View>
            )
        })
    }

    render() {
        return (
            <>
                {this.renderList()}
            </>
        )
    }

在上面的代码中，console.log(account.accountName) 正在运行，但它没有在渲染方法中打印。我需要用这些数据创建一个列表。

Answer 1

请试试这个：

    renderList = () => {
            const { accounts } = this.props;
     if(accounts){
            return accounts.map((account) => {
                return (
                    <View>
                        <Text>{account.accountName}</Text>
                        {console.log(account.accountName)}
                    </View>
                )
            })
}
        }

        render() {
            return (
                <>
                    {this.renderList()}
                </>
            )
        }

希望对您有所帮助

Answer 2

我也遇到了同样的问题，这对我有用。在箭头 ( => ) 之后使用括号而不是像这样的大括号 ( => (... 你的代码 ...) 不是这个 => {....}

这是您编辑的代码

renderList = () => {
        const { accounts } = this.props
        accounts && accounts.map((account) => ( // don't use curly brace! use bracket "("
            return (
                <View>
                    <Text>{account.accountName}</Text>
                    {console.log(account.accountName)}
                </View>
            )
        )) // and here also; not curly brace; but a bracket ")"
    }

    render() {
        return (
            <>
                {this.renderList()}
            </>
        )
    }

为什么 React Native 地图功能无法正常工作？

Why react native map function is not working properly?

firebase

react-native

redux-firestore

这是您编辑的代码