从 React Relay Container 获取组件

Question

如何从 React Relay Container 获取 Component 获取静态变量？

从“./pages/home”导入主页；

console.log(Home.route) // 未定义

我需要类似 Home.Component.route // 对象

class Home extends React.Component {
  static route = {
    component: Home,
    route: HomeRoute,
    leftButton: false,
    sideMenu: false,
  };

  render() {
    return (
      <View style={styles.container}>
        <Text>
          Home
        </Text>
        <Text>
            {this.props.greetings.hello}
        </Text>
      </View>
    );
  }
}

export default Relay.createContainer(Home, {
  fragments: {
    greetings: () => Relay.QL`
      fragment on Greetings {
        hello,
      }
    `,
  }
});

Answer 1

我认为如果不执行以下操作之一，就无法静态地解决此问题。

备选方案 1：添加包装组件的显式 `export`

// In "Home.js":
export class HomeComponent extends React.Component {
  static route = {
    // ...
  }
}

export default Relay.createContainer(HomeComponent, {
  // ...
});

// In "Other.js":
import Home, {HomeComponent} from './Home.js';

console.log("should have access here", HomeComponent.route);

备选方案 2：在导出前向容器添加属性

const HomeContainer = Relay.createContainer(
  // ...
);

HomeContainer.route = {
  // ...
};

export default HomeContainer;

方案3：运行时通过refs访问

一旦容器被安装并且你有一个对它的引用，你可以通过 "component" ref 获取原始组件。请注意，这没有记录在案，因此不能保证将来会起作用。

// In "Other.js":
render() {
  return (
    <Home
      ref={
        container => (
          console.log(container.refs.component.route)
        )
      }
    />
  );
}

显然，这是三个备选方案中最骇人听闻的一个，所以我可能不会推荐它。

从 React Relay Container 获取组件

Get component from react relay Container

relayjs

备选方案 1：添加包装组件的显式 `export`

备选方案 2：在导出前向容器添加属性

方案3：运行时通过refs访问

从 React Relay Container 获取组件

Get component from react relay Container

relayjs

备选方案 1：添加包装组件的显式 export

备选方案 2：在导出前向容器添加属性

方案3：运行时通过refs访问

备选方案 1：添加包装组件的显式 `export`