State managing library handles state dependencies, facilitating component creation and rendering. Offers customizable state management and efficient component interaction for dynamic web applications.
pom.xml
<dependency>
<groupId>net.kigawa</groupId>
<artifactId>renlin</artifactId>
<version>{version}</version>
</dependency>build.gradle.kts
implementation("net.kigawa:renlin:{version}")write a root component
class SampleComponent(
val name: String,
val sub: Sub,
) {
val root = div.component {
t("test root")
// call subcomponent
sub.display {
}
fragment {
div {
fragment {
p {
t("text")
}
}
}
}
sub.controller {
}
}
}
write a subcomponent
class Sub(
dispatcher: StateDispatcher,
) {
val state: MutableState<String> = dispatcher.newState("state")
val display = div.component {
t("display")
div {
val value = state.useValue()
t("display1")
div {
t("display1-1")
p {
t("display1-1-1 $value")
}
}
}
}
val controller = div.component {
t("controller")
}
// fragment component
val test = fragment<FlowContent>().component { }
val test1 = fragment<PhrasingContent>().component { }
val test2 = fragment<FlowPhrasingIntersection>().component { }
}set state
state.set("new value")init endpoint
val root = document.getElementById("root") ?: throw Exception("Root not found")
val sub = Sub()
val sample = SampleComponent("sample", sub)
val dispatcher = HakateInitializer().newStateDispatcher()
Entrypoint(root).render(sample.root, dispatcher)pom.xml
<dependency>
<groupId>net.kigawa</groupId>
<artifactId>renlin</artifactId>
<version>{version}</version>
</dependency>build.gradle.kts
implementation("net.kigawa:renlin:{version}")write a root component
class SampleComponent(
val name: String,
val sub: Sub,
) {
val root = div.component {
t("test root")
// call subcomponent
sub.display {
}
fragment {
div {
fragment {
p {
t("text")
}
}
}
}
sub.controller {
}
}
}
write a subcomponent
class Sub(
dispatcher: StateDispatcher,
) {
val state: MutableState<String> = dispatcher.newState("state")
val display = div.component {
t("display")
div {
val value = state.useValue()
t("display1")
div {
t("display1-1")
p {
t("display1-1-1 $value")
}
}
}
}
val controller = div.component {
t("controller")
}
// fragment component
val test = fragment<FlowContent>().component { }
val test1 = fragment<PhrasingContent>().component { }
val test2 = fragment<FlowPhrasingIntersection>().component { }
}set state
state.set("new value")init endpoint
val root = document.getElementById("root") ?: throw Exception("Root not found")
val sub = Sub()
val sample = SampleComponent("sample", sub)
val dispatcher = HakateInitializer().newStateDispatcher()
Entrypoint(root).render(sample.root, dispatcher)