reason - 如何在 ReasonReact 中共享道具？

Question

概括

假设我有一个reducerComponent

<TodoList />

使用statelessComponent

<TodoItem todo />

这todo是一个名为todoItem.

type todoItem = {
  text: string,
  isDone: bool,
};

但是，我不能共享todoItem类型。

• 如果我定义类型TodoList.re TodoItem会抱怨。
• 如果我定义类型TodoItem.re TodoList会抱怨。

来源

这是我的TodoList.re

/** TodoList.re */

// ↓ I defined `todoItem` type
type todoItem = {
  text: string,
  isDone: bool,
};

// state depends on `todoItem` type ↓
type state = {todoList: list(todoItem)};

let component = ReasonReact.reducerComponent("TodoList");

let make = _children => {
  ...component,
  initialState: () => {todoList: []},
  reducer: (action, state) => ...,
  render: self =>
    <div> {List.map(todo => <TodoItem todo />, self.state.todoList)} </div>,
};

和TodoItem.re

/** TodoItem.re */

let component = ReasonReact.statelessComponent("TodoItem")

let make  = (~todo, _children) => {
    ...component,
    render: (_self) => {
        // ↓ I'm getting an error here
        <p>(ReasonReact.string(todo.text))</p>
    }
}

错误信息

[1/2] Building ...em-ReactTemplate.cmj

  We've found a bug for you!
  /Users/kkweon/temp/my-react-app/src/components/TodoItem.re 6:37-40

  4 │     ...component,
  5 │     render: (_self) => {
  6 │         <p>(ReasonReact.string(todo.text))</p>
  7 │     }
  8 │ }

  The record field text can't be found.

  If it's defined in another module or file, bring it into scope by:
  - Annotating it with said module name: let baby = {MyModule.age: 3}
  - Or specifying its type: let baby: MyModule.person = {age: 3}

>>>> Finish compiling(exit: 1)

Answer 1

每个原因文件都是一个模块。

所以，定义后

type todoItem = {
  text: string,
  isDone: bool,
};

在TodoItem.re

我可以称之为

type state = {todoList: list(TodoItem.todoItem)};