0

open和模块前缀应该如何在 rescript 和 rescript-react 中工作。它似乎没有遵守文档。例如，我有一个文件阅读器模块

文件阅读器.res

module FileReader = {
  type fileReader
  type file = {"name": string, "lastModified": int, "size": int, "type__": string}

  @new external createFileReader: unit => fileReader = "FileReader"

  @bs.send
  external readAsDataURL: (fileReader, file) => unit = "readAsDataURL"

  let onload: (fileReader, string => unit) => unit = %raw(`
    function (reader, cb) {
      reader.onload = function (e) {
        cb(e.target.result);
      }
    }
  `)

  let fileToDataUrl: (file, string => unit) => unit = (file, continue) => {
    let reader = createFileReader()
    onload(reader, continue)
    readAsDataURL(reader, file)
  }
}

我试图从反应组件中使用：

上传.res

open FileReader
let k = x => (_ => x)
let setState = stateHook => (newVal => stateHook(_ => newVal))
let firstFileFromEvent = event => ReactEvent.Form.target(event)["files"][0]

@react.component
let make = () => {
    let (dataUrl, setDataUrl) = React.useState(k(""))
    let setDataUrlState = setState(setDataUrl)

    let fileOnChange = (event) =>
        event ->
            firstFileFromEvent ->
            FileReader.fileToDataUrl(setDataUrlState)

    <div>
        <input type_="file" onChange=fileOnChange/>
        <img src=dataUrl/>
    </div>
}

让代码编译的唯一方法是

  1. 打开
  2. 使用模块名称引用

我的理解是你只需要做一个或另一个。如果我删除该open语句，这是编译器的输出

我们为您发现了一个错误！
src/Upload.res:15:13-36

13 ┆ 事件 -> 14 ┆ firstFileFromEvent -> 15 ┆<br /> FileReader.fileToDataUrl(setDataUrlState) 16 ┆ 17 ┆

在 FileReader 中找不到值 fileToDataUrl

添加 open 语句并将语句更改FileReader.fileToDataUrl(setDataUrlState)为fileToDataUrl(setDataUrlState)导致此异常：

我们为您发现了一个错误！
src/Upload.res:15:13-25

13 ┆ 事件 -> 14 ┆ firstFileFromEvent -> 15 ┆<br /> fileToDataUrl(setDataUrlState) 16 ┆ 17 ┆

找不到值 fileToDataUrl

open我在函数调用的语句和模块前缀中发布的源代码可以编译但有一个警告：

警告号 44
src/Upload.res:1:1-15

1 │ 打开 FileReader 2 │ 3 │ 让 k = x => (_ => x)

此 open 语句隐藏模块标识符 FileReader（稍后使用）

我在 Mac 上；使用rescript 9.1.4；

4

1 回答 1

2

在 rescript 中，每个代码文件本身就是一个模块。通过将代码放入FileReader.res您已经创建了一个名为FileReader. 通过使用module FileReader = { ... }，您正在创建另一个在其中调用的子模块FileReader。

那么简单的解决方案就是不将其包装在子模块中。或者，您也可以open FileReader.FileReader.

警告告诉您的是，当您open FileReader导入另一个模块时，它会FileReader隐藏（即隐藏）也称为 的顶级模块FileReader。

于 2021-11-05T19:32:46.367 回答