Question

我正在使用ReasonReact创建网站，但是在使用普通组件时遇到此错误消息。有人知道发生了什么吗？

module Component1 = {
  let component = ReasonReact.statelessComponent("Component1");
  let make = () => {...component, render: self => <div />};
};

module Component2 = {
  let component = ReasonReact.statelessComponent("Component1");
  let make = () => {
    ...component,
    render: self => <div> <Component1 /></div>, /*error on compenent1*/ 
  };

这是错误消息：


(
  React.component('props),
  'props
) => React.element
<root>/node_modules/reason-react/src/React.re

Error: This expression has type
         unit =>
         ReasonReact.componentSpec(ReasonReact.stateless,
                                    ReasonReact.stateless,
                                    ReasonReact.noRetainedProps,
                                    ReasonReact.noRetainedProps,
                                    ReasonReact.actionless)
       but an expression was expected of type
         React.component(unit) = unit => React.element
       Type
         ReasonReact.componentSpec(ReasonReact.stateless,
                                    ReasonReact.stateless,
                                    ReasonReact.noRetainedProps,
                                    ReasonReact.noRetainedProps,
                                    ReasonReact.actionless)
       is not compatible with type React.element

Answer 1

问题似乎是您正在使用一个项目，该项目配置为将JSX版本3与为JSX版本2设计的组件一起使用。

RationalReact 0.7.0中引入了JSX版本3，以及用于定义支持钩子的React组件的新方法，但是只要将项目配置为使用JSX版本2，它仍然支持您使用的方法。这是一个新项目，似乎是这样，我建议您使用新的组件样式，其中您的代码将看起来像这样：

module Component1 = {
  [@react.component]
  let make = () =>
    <div />;
};

module Component2 = {
  [@react.component]
  let make = () =>
    <div> <Component1 /> </div>;
};

或者，您可以通过在bsconfig.json中指定以下内容来继续使用旧样式的组件和JSX版本2：

{
  ...
  "reason": {"react-jsx": 2}
}

有关更多详细信息，请参见the blog post on ReasonReact 0.7.0。

使用组件时收到错误消息

1 个答案: