如何使用Websharper創建滑塊？

我只是在學習Websharper，所以我還是很困惑。如何使用Websharper創建滑塊？

在Intellifactory樣本網頁的計算器示例代碼似乎使用Button彷彿Webshaper提供了一些GUI控件，但安裝在磁盤上的代碼使用它自己的輔助函數來創建這樣一個按鈕：

let btn caption action = 
    Input [Attr.Type "button"; Attr.Value caption; Attr.Style "width: 30px"] 
    |>! OnClick (fun e _ -> action())

好像Webshaper不包含基本的GUI控件，所以你必須做這樣的事情來獲得它們（這似乎違背了使用像Websharper這樣的抽象的目的）。

我想要一個帶有回調的滑塊，只要其值發生變化就會被調用。我如何使用Websharper獲得一個？

來源

2012-11-11 Jon Harrop

您可以使用滑塊從jQueryUI的：

[<JavaScript>] 
override this.Body = 
    let text = Span [] 
    let slider = Slider.New(SliderConfiguration(min = 0, max = 10, value = 5)) 
    // typed way to subscribe doesn't work, internally tries to bind handler to 'sliderslide' event 
    // per documentation (http://api.jqueryui.com/slider/#event-slide) should be 'slide' 
    // slider.OnSlide(fun _ -> text.Text <- string slider.Value) 
    JQuery.JQuery.Of(slider.Widget).Bind("slide", Func<_, _, _>(fun _ _ -> text.Text <- string slider.Value)).Ignore 
    Div [ 
     Div [ slider ] 
     Div [ text ] 
    ] :> _

來源

2012-11-12 02:15:29 desco

還有我們的圖書館，試圖多一點打字添加了jQuery UI代碼。您可以從NuGet獲取最新版本：http：//nuget.org/packages/WebSharper.JQueryUi – t0yv0

如何使用Websharper創建滑塊？

回答

相關問題