[Elm] Browser.Navigation.pushUrlとUrl.Builder.relativeの落とし穴
解決に時間がかかった。
発生した問題
import Browser.Navigation as Nav
import Url.Builder
type alias Model =
{ hoge : string
}
modelToQueryParameters : Model -> List Url.Builder.QueryParameter
-- 実装省略
changeUrl : Nav.key -> Model -> Cmd msg
changeUrl key model =
Nav.pushUrl key (Url.Builder.relative [] (modelToQueryParameters model))
このとき、時折onUrlChange
に対応するメッセージがうまく生成されなかった。
具体的には、modelToQueryParameters
によって生成されるリストが空である時。
原因
> Url.Builder.relative [] []
""
Url.Builder.relative
は両方が空リストになってしまう場合には、空文字列を生成する。
割と直感的な動作ではあるが、Browser.Navigation.pushUrl
の第二引数に空文字列を入れてしまうと、遷移が行われなくなってしまう。
解決
- Nav.pushUrl key (Url.Builder.relative [] (modelToQueryParameters model))
+ Nav.pushUrl key (Url.Builder.relative ["."] (modelToQueryParameters model))
modelToQueryParameters
が空リストを生成した場合でも確実に遷移するよう、第一引数のリストに"."
を追加した。