将道具从布局传递给盖茨比的孩子

Question

我如何将道具从盖茨比布局传递给孩子(例如标头组件(？

import React from "react";
export default ({ children }) => {
    return <div>{children()}</div>;
};

我找到的资源使用以下格式：

{ props.children({ ...props, foo: true }) }
{ this.props.children({...this.props, updateLayoutFunction }) }

，但是由于没有props，但是只有孩子，我无法工作。我尝试了这个，但也没有用：

{ children({ foo: true }) }

在所有情况下，我都会得到此错误：TypeError: undefined is not an object (evaluating 'history.listen')

https://github.com/gatsbyjs/gatsby/issues/3412#Event-1446894145https://github.com/gatsbyjs/gatsby/issues/2112

Answer 1

但是有道具，你只是不将它们传递给孩子。

在您的布局文件中，而不是：

export default ({ children }) // ... etc

做

export default (props) {
  const myOwnProperties = { foo: true };
  return (
    {props.children({ ...props, ...myOwnProperties })}
  );
}

您看到，道具将自动传递，直到您添加自己的道具为止。