如何处理 WebSharper UI.Next 中选择选项的 onchange

Question

我正在尝试根据从 Doc.Select 中选择的选项显示不同的 SPA 视图。

我想使用 WebSharper UI.Next 处理 onchange 事件。我搜索了一些信息，看到了on，它可以在Elt 的属性中设置，如下所示：

spanAttr [on.click (fun el ev -> ())] [text "some span"]

在这里找到：http://www.websharper.com/question/81410/event-handlers-for-ui-next-elt-objects

但是，我很不确定如何使用 UI.Next 中提供的工具来处理 Doc.Select 上的更改。

我有以下几点：

let rv = Var.Create "1"
Doc.Select [  ] (fun _ -> "") [ "1"; "2"; "3" ] rv

我不确定如何访问 onchange 事件，因此我可以使用路由器重定向到不同的 SPA 视图。

根据下拉选择更改视图等操作的惯例是什么？

Answer 1

您不需要自己处理onchange。如果您使用Doc.Select，则相应的Var 将在每次下拉列表更改时更新。你可以这样做：

rv.View.Doc(function
    | "1" -> text "page 1"
    | "2" -> text "page 2"
    | "3" -> text "page 3"
    | _ -> failwith "Should never happen")

并将其嵌入到您的主要Doc 中，然后进行渲染。