Elm'e basit bir web uygulaması oluşturma düşüncesiyle bakmaya başlıyorum. Fikrim, tarayıcıdaki bazı kullanıcı verilerini sürdürmek zorunda kalacaktı.Elm'de veri kalıcılığı
Veri kalıcılığını doğrudan Elm ile halletmenin bir yolu var mı? Örneğin tarayıcı oturumunda veya hatta yerel depolamada? Yoksa JavaScript ile bunu yapmak için port kullanmalı mıyım?
TheSeamau5's elm-storage'a bakabilirsiniz. Verileri yerel depolarda depolamayı mümkün kılar.
localStorage'ı kullanmanızı öneririm. Son elmde bunun için resmi bir destek yoktur (bu zamana kadar 0.17), ancak bunu sadece portlar üzerinden yapabilirsiniz. Bu +/- düğmelere basarak,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/elm.js"></script>
</head>
<body>
</body>
<script type="text/javascript">
var storageKey = "token";
var app = Elm.Main.fullscreen();
app.ports.save.subscribe(function(value) {
localStorage.setItem(storageKey, value);
});
app.ports.doload.subscribe(function() {
app.ports.load.send(localStorage.getItem(storageKey));
});
</script>
</html>
Şimdi karaağaç 0,17
port module Main exposing (..)
import Html exposing (Html, button, div, text, br)
import Html.App as App
import Html.Events exposing (onClick)
import String exposing (toInt)
main : Program Never
main = App.program
{
init = init
, view = view
, update = update
, subscriptions = subscriptions
}
type alias Model = Int
init : (Model, Cmd Msg)
init = (0, Cmd.none)
subscriptions : Model -> Sub Msg
subscriptions model = load Load
type Msg = Increment | Decrement | Save | Doload | Load String
port save : String -> Cmd msg
port load : (String -> msg) -> Sub msg
port doload :() -> Cmd msg
update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
case msg of
Increment ->
(model + 1, Cmd.none)
Decrement ->
(model - 1, Cmd.none)
Save ->
(model, save (toString model))
Doload ->
(model, doload())
Load value ->
case toInt value of
Err msg ->
(0, Cmd.none)
Ok val ->
(val, Cmd.none)
view : Model -> Html Msg
view model =
div []
[ button [ onClick Decrement ] [ text "-" ]
, div [] [ text (toString model) ]
, button [ onClick Increment ] [ text "+" ]
, br [] []
, button [ onClick Save ] [ text "save" ]
, br [] []
, button [ onClick Doload ] [ text "load" ]
]
Ve index.html için portlar üzerinden localStorage kullanmanın (resmi dokümanlardan bir örnek dayanarak) bir çalışma örneğidir int değerini değiştirirsiniz. "Kaydet" düğmesine bastığınızda, uygulama gerçek değeri localStorage ("jeton" tuşuyla) içine kaydeder. Ardından sayfayı yenilemeye çalışın ve "yükle" düğmesine basın - localStorage'dan değeri geri alır (HTML metin denetimi geri yüklenen değerle gerçekleştirildiğini görmelisiniz).
Sıfır için 'localStorage.getItem (storageKey)' seçeneğini kontrol etmek daha kolay olur ve null durumunda, aramayı 'app.ports.load.send' adresine bırakın ya da boş bir dizeyi iletin. – Gira
resmi cevap "kullanım portları" (bu sayfadaki örnek temelde 0.18 çalışmalıdır) 'dir Elm resmi yerel depolama kütüphanede yayınlanmasını beklerken: https://github.com/elm-lang/persistent-cache
Bu örnek artık kullanılmamaktadır sinyalleri kullanır ... –