1
0

Add Elm Maybe map page.

This commit is contained in:
PA4KEV 2024-04-21 00:15:04 +02:00
parent 10e9ea354b
commit ba42fb088f
5 changed files with 93 additions and 3 deletions

View File

@ -1,3 +1,4 @@
### Elm
* [Formatting](./formatting)
* [Formatting](./formatting)
* [Maybe.map](./maybemap)

View File

@ -0,0 +1,44 @@
Elm - Maybe Map
===============
Here, a tooltip title attribute needs to be added if it is **Just**.
```elm
let
divAttributes =
[ HA.classList
[ ( "my-div", True ) ]
]
combinedAttributes =
case settings.tooltip of
Just tooltip ->
divAttributes ++ [ HA.title tooltip ]
Nothing ->
divAttributes
in
H.div
combinedAttributes
[ content ]
```
This can be easier written with the [Maybe.map](https://package.elm-lang.org/packages/elm/core/latest/Maybe#map) and [Maybe.withDefault](https://package.elm-lang.org/packages/elm/core/latest/Maybe#withDefault) functions.
```elm
let
divAttributes =
[ HA.classList
[ ( "my-div", True ) ]
]
tooltipAttribute =
Maybe.map (\tooltip -> [ HA.title tooltip ]) settings.tooltip |> Maybe.withDefault []
in
H.div
(divAttributes ++ tooltipAttribute)
[ content ]
```

View File

@ -1,3 +1,4 @@
### Elm
* [Formatting](./formatting)
* [Formatting](./formatting)
* [Maybe.map](./maybemap)

View File

@ -0,0 +1,44 @@
Elm - Maybe Map
===============
hier moet een tooltip als title attribuut worden toegevoegd als deze **Just** is.
```elm
let
divAttributes =
[ HA.classList
[ ( "my-div", True ) ]
]
combinedAttributes =
case settings.tooltip of
Just tooltip ->
divAttributes ++ [ HA.title tooltip ]
Nothing ->
divAttributes
in
H.div
combinedAttributes
[ content ]
```
Dit kan makkelijker met de [Maybe.map](https://package.elm-lang.org/packages/elm/core/latest/Maybe#map) en [Maybe.withDefault](https://package.elm-lang.org/packages/elm/core/latest/Maybe#withDefault) functies.
```elm
let
divAttributes =
[ HA.classList
[ ( "my-div", True ) ]
]
tooltipAttribute =
Maybe.map (\tooltip -> [ HA.title tooltip ]) settings.tooltip |> Maybe.withDefault []
in
H.div
(divAttributes ++ tooltipAttribute)
[ content ]
```

View File

@ -8,7 +8,7 @@ export const elmRoutes = languages.map(lang => {
const main = <Route key={`${lang}-elm-main`} exact path={`/${lang}/software/elm/`} element={<ElmPage mdPath={`Software/elm/${lang}/main.md`} />} />
// Pages within Elm.
const md = ['formatting'];
const md = ['formatting', 'maybemap'];
const entries = md.map(entry => {
const path = `/${lang}/software/elm/${entry}`;
const mdPath = `Software/elm/${lang}/${entry}.md`;