CODEWITHSUNDEEP
reactjskotlin
auser
auser

Reputation: 7577

How to extract kotlin-react html into a method

I'd like to create a method containing an "html" snippet but I get the error below. 

import react.dom.a
import react.dom.button
import react.dom.div
import react.dom.nav
import react.dom.span
import kotlinx.html.ButtonType
import react.RBuilder
import react.RComponent
import react.RProps
import react.RState

class App : RComponent<RProps, RState>() {

    override fun RBuilder.render() {

        div("container fill") {
        }
        div {
            content()
        }
    }

    fun content() {
        return div() { } // the error below is for this line
    }
}

error: unresolved reference. None of the following candidates is applicable because of receiver type mismatch: public inline fun RBuilder.div(classes: String? = ..., block: RDOMBuilder.() -> Unit): ReactElement defined in react.dom return div() {

Any ideas?

Upvotes: 4

Views: 569

Answers (1)

deviant
deviant

Reputation: 3711

You should add the receiver, and probably get rid of return like this:

class App : RComponent<RProps, RState>() {

    override fun RBuilder.render() {

        div("container fill") {
        }
        div {
            content()
        }
    }

    fun RBuilder.content() {
        div() { }
    }
}

Upvotes: 1

Related Questions