Checkbox.md

Component Checkbox mapping lvgl lv_checkbox)

Api

• style
• moveToFront
• moveToBackground
• setStyle
• scrollIntoView

Props

• style
• align
• alignTo
• checked
• checkedStyle
• indicatorStyle
• indicatorCheckedStyle
• onChange
• value
• disabled
• text

Controlled Mode

Component Checkbox support controlled mode, achieve by onChange and value props

Usage

import { Checkbox } from 'lvlgjs-ui'
import { useState } from 'react'

function Component () {
    const [value, setValue] = useState(false)
    return (
        <React.Fragment>
            {/* controlled */}
            <Checkbox
              style={style.checkbox}
              onChange={(e) => setValue(e.checked)}
              checked={value}
              text={"商品A"}
            />
            {/* not controlled */}
            <Checkbox
              style={style.checkbox}
              onChange={(e) => console.log(e.checked)}
              text={"商品B"}
              disabled={true}
              checked={true}
            />
        </React.Fragment>
    )
}

const style = {
    checkbox: {},
}

Demo

test/checkbox