如何在KotlinJS的MUI中设置Grid组件的xs断点值

在JetBrains的kotlin-mui封装中，Grid组件的xs参数对应GridSize类型，它支持三种你需要的场景，具体写法如下：

• 设置xs="auto"：使用GridSize.auto
• 设置xs={6}：直接传入整数6（kotlin-mui会自动将其转为对应的GridSize实例）
• 设置无值的xs（即占满剩余可用空间）：使用GridSize.trueValue

对应你提供的React代码，移植后的Kotlin代码如下：

Grid(container = true, spacing = 3) {
    Grid(xs = GridSize.auto) {
        Item { +"variable width content" }
    }
    Grid(xs = 6) {
        Item { +"xs=6" }
    }
    Grid(xs = GridSize.trueValue) {
        Item { +"xs" }
    }
}

补充说明：kotlin-mui对Material UI的Props做了类型安全封装，GridSize是密封类，涵盖了所有合法的断点值选项，确保编译时就能校验参数的合法性。

内容的提问来源于stack exchange，提问作者Stan van der Bend