Apollo查询组件:将查询数据存储在一个地方,而不必一遍又一遍地使用它

时间:2018-11-13 05:52:27

标签: reactjs apollo apollo-client

我正在使用Apollo的Query组件来获取已登录的用户,我想将用户数据存储在一个地方,这样我就可以在需要时访问单个详细信息,而不必使用Query组件一遍又一遍。

查询代码

<Query query={CURRENT_USER}>
    {({loading, error, data:{me}}) => {
        if (loading) 
            return "Loading...";
        if (error) 
            return `Error! ${error.message}`;
        const {name,username,email,lists} = me;

        // Store the user data somewhere.
        return true;
     }}
</Query>

组件

export default class Header extends Component {
    render() {
        return (
            <header>
                <nav>
                    <span id="logo">Expense Manager</span>
                    <div id="profile-options">
                        <span id="user-name">{me.name}</span>
                    </div>
                </nav>
                {me.lists.map(item => <span>{item}</span>})}
            </header>
        )
    }
}

我必须在多个位置显示用户数据,因此我需要先将其存储在一个位置。我从Query组件本身内部尝试过setState(),但它无法执行。

0 个答案:

没有答案