如何使用recompose从Context.Consumer访问值？

Question

我使用React Context API传递了一些数据 我尝试从重组方法内部访问它

您以哪种方式重新组合访问Consumer's数据？

import React from "react";
import { MyContext } from "./index";
import { fromRenderProps, withProps, compose } from "recompose";

const enhance = compose(
    /**
     * @todo add 'Mr.' to each name
     */
    withProps(/** How do I get "names" from Consumer here? */)
);

const GrandChild = props => {
    return (
        <MyContext.Consumer>
            {names => {
                console.log(names)
                return (
                    <div>
                        <h2>GrandChild</h2>
                        {names.map((name, index) => (<li key={index}>{name}</li>))}
                    </div>
                );
            }}
        </MyContext.Consumer>
    );
};

export default enhance(GrandChild);

实时代码： https://codesandbox.io/s/k0xm2vlw8r

Answer 1

这是解决此问题的一种方法：

git clean -fd

GrandChild.js

只需添加一个单独的图层即可提供上下文。

这是CodeSandbox：