You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.7 KiB
54 lines
1.7 KiB
package com.example.playscalajsreact.component
|
|
import com.example.playscalajsreact.model.MyGlobalState
|
|
import japgolly.scalajs.react.vdom.VdomElement
|
|
import japgolly.scalajs.react.Callback
|
|
import japgolly.scalajs.react._
|
|
import japgolly.scalajs.react.vdom.html_<^._
|
|
import com.example.playscalajsreact.route.AppRouter
|
|
import japgolly.scalajs.react.extra.router.RouterCtl
|
|
import com.example.playscalajsreact.route.Page
|
|
import com.example.playscalajsreact.route.Page._
|
|
import japgolly.scalajs.react.extra.StateSnapshot
|
|
import com.example.playscalajsreact.model.User
|
|
|
|
object MenuComponent {
|
|
case class State(myGlobalState: MyGlobalState = MyGlobalState())
|
|
case class Props(state: StateSnapshot[MyGlobalState], c: RouterCtl[Page])
|
|
|
|
class Backend($ : BackendScope[Props, Unit]) {
|
|
|
|
def render(props: Props): VdomElement =
|
|
{
|
|
val name = props.state.value.user.getOrElse(User.empty).username
|
|
<.ul(
|
|
Array(
|
|
Menu("Home", Home),
|
|
Menu("Hello", Hello),
|
|
Menu(name, Person(name, 0)),
|
|
Menu("Editor", Editor),
|
|
Menu("Test", Test)
|
|
).toTagMod { item =>
|
|
{
|
|
<.li(
|
|
^.key := item.name,
|
|
<.a(
|
|
item.name,
|
|
props.c setOnClick item.route,
|
|
^.color := "red"
|
|
)
|
|
)
|
|
}
|
|
}
|
|
)
|
|
}
|
|
}
|
|
|
|
private val component = ScalaComponent
|
|
.builder[Props]("menu")
|
|
// .initialState(State())
|
|
.renderBackend[Backend]
|
|
// .componentDidMount($ => $.backend.refresh($.state))
|
|
.build
|
|
|
|
def apply(state: StateSnapshot[MyGlobalState], c: RouterCtl[Page]) = component(Props(state, c))
|
|
}
|