KotlinJS React：实例化类时如何向构造函数传值？

首先需要纠正你的Foo类定义：RComponent的子类必须接收props参数并传递给父类构造器，正确的类定义应该是这样：

class Foo(private val someVal: String, props: SomeProp) : RComponent<SomeProp, SomeState>(props) {
    // 组件逻辑
}

接下来提供两种可行的传值方式：

方案一：将参数转为Props属性（推荐） #

如果someVal是组件需要的外部配置项，最符合React设计模式的方式是把它整合到SomeProp中：

1. 修改SomeProp接口，添加someVal字段：

interface SomeProp : RProps {
    var someVal: String
    var bar: String
    var bar2: String
}

2. 更新Foo类，通过props获取someVal：

class Foo(props: SomeProp) : RComponent<SomeProp, SomeState>(props) {
    private val someVal = props.someVal
    // 组件逻辑
}

3. 实例化时直接通过attrs传递值：

child(Foo::class) {
    attrs.someVal = "你要传入的someVal值"
    attrs.bar = props.bar
    attrs.bar2 = props.bar2
    // 其他属性设置
}

方案二：通过组件工厂函数传递构造器参数 #

如果someVal是组件的私有依赖，不想暴露为Props，可以通过自定义组件工厂函数来传递：

1. 定义一个返回组件类的工厂函数：

fun fooComponent(someVal: String): ComponentClass<SomeProp> =
    object : ComponentClass<SomeProp>() {
        override fun createInstance(props: SomeProp): Component<SomeProp, SomeState> {
            return Foo(someVal, props)
        }
    }

2. 实例化时调用工厂函数并传入someVal：

child(fooComponent("你要传入的someVal值")) {
    attrs.bar = props.bar
    attrs.bar2 = props.bar2
    // 其他属性设置
}

或者你可以封装成RBuilder的扩展函数，让调用更简洁：

fun RBuilder.Foo(someVal: String, block: RHandler<SomeProp>) {
    child(fooComponent(someVal), block)
}

// 调用方式
Foo("你要传入的someVal值") {
    attrs.bar = props.bar
    attrs.bar2 = props.bar2
}

内容的提问来源于stack exchange，提问作者four-eyes