2
elm tutorialのプレイヤー削除メソッドを正常に実装しました。 しかし、サーバーからプレーヤーを再び取得するメッセージをForchFetch
msg(ボタンをクリックして)を手動で送信しないと、モデルを更新することができません。これは私のコードです:elmモデルから値を削除する
マイ削除ボタン:
deleteBtn : Player -> Html.Html Msg
deleteBtn player =
let
message =
Msgs.Delete player
in
a
[ class "btn regular", onClick message]
[ i [ class "fa fa-pencil mr1" ] [], text "Delete" ]
マイ削除メッセージ:
type Msg =
| Delete Player
| OnDeletePlayer (Result Http.Error Player)
| ForceFetch
| OnFetchPlayers (WebData (List Player))
私の更新機能:
update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
Msgs.ForceFetch ->
(model, fetchPlayers)
Msgs.OnFetchPlayers response ->
({ model | players = response }, Cmd.none)
Msgs.Delete player ->
(model, deletePlayerCmd player)
Msgs.OnDeletePlayer (Ok player) ->
(updateDeletedPlayerList model player, Cmd.none)
Msgs.OnDeletePlayer (Err player) ->
(model, Cmd.none)
updateDeletedPlayerList : Model -> Player -> Model
updateDeletedPlayerList model deletedPlayer =
let
updatedPlayers = RemoteData.map (List.filter (\p -> deletedPlayer /= p)) model.players
in
{ model | players = updatedPlayers}
deletePlayerCmd : Player -> Cmd Msg
deletePlayerCmd player =
Http.send Msgs.OnDeletePlayer (deletePlayerRequest player)
deletePlayerRequest : Player -> Http.Request Player
deletePlayerRequest player =
Http.request
{ body = Http.emptyBody
, expect = Http.expectJson playerDecoder
, headers = []
, method = "DELETE"
, timeout = Nothing
, url = savePlayerUrl player.id
, withCredentials = False
}
fetchPlayers : Cmd Msg
fetchPlayers =
Http.get fetchPlayersUrl playersDecoder
|> RemoteData.sendRequest
|> Cmd.map Msgs.OnFetchPlayers
そして、良い対策のための私のモデル:
type alias Model =
{ players : WebData (List Player)
, route : Route
, newPlayerName : String
, newPlayerId : String
, newPlayerLevel : Int
}
編集:
ノー成功を収めて、次のようにfetchPlayers
を組み込む試してみました:
Msgs.OnDeletePlayer (Ok player) ->
(updateDeletedPlayerList model player, fetchPlayers)
'ForceFetch'が動作する場合、あなたの編集の試みがうまくいかない理由はわかりません。あなたは応答が 'Err'ではなく' Ok'で終わると確信していますか? – Dogbert
私はそれを解決しました、私はすぐに答えを更新します。 – Jimbo
フィルターのプレイヤーレコードを比較している場合、サーバーから取得したものと一致しない可能性があります。 player.idだけを比較してください。 – Sebastian