mobx-sentinel API doc
    Preparing search index...

    Standard binding extensions for React form elements

    Form will be extended with these methods.

    This interface exists for the sole purpose of documentation.

    interface StandardExtensions<T> {
        bindCheckBox: RequiredConfig<T, typeof CheckBoxBinding>;
        bindInput: RequiredConfig<T, typeof InputBinding>;
        bindLabel: OptionalConfig<T, typeof LabelBinding>;
        bindRadioButton: RequiredConfig<T, typeof RadioButtonBinding>;
        bindSelectBox: RequiredConfig<T, typeof SelectBoxBinding>;
        bindSubmitButton: OptionalConfig<T, typeof SubmitButtonBinding>;
    }

    Type Parameters

    • T
    Index

    Properties

    bindCheckBox: RequiredConfig<T, typeof CheckBoxBinding>

    Bind the checkbox field to the form.

    <input
    {...form.bindCheckBox("boolean", {
    getter: () => model.boolean,
    setter: (v) => (model.boolean = v),
    })}
    />
    bindInput: RequiredConfig<T, typeof InputBinding>

    Bind the input field to the form.

    <input> except the following types: button, submit, reset, hidden, image, file, checkbox, and radio. For checkbox and radio, use bindCheckBox and bindRadioButton respectively.

    <input
    {...form.bindInput("string", {
    getter: () => model.string,
    setter: (v) => (model.string = v),
    })}
    />
    <input
    {...form.bindInput("number", {
    valueAs: "number", // also supports "date"
    getter: () => model.number,
    setter: (v) => (model.number = v),
    })}
    />
    bindLabel: OptionalConfig<T, typeof LabelBinding>

    Bind the label to the form.

    <label {...form.bindLabel(["field1"])}>Label</label>
    <label {...form.bindLabel(["field1", "field2"])}>Label</label>
    bindRadioButton: RequiredConfig<T, typeof RadioButtonBinding>

    Bind the radio button field to the form.

    const bind = form.bindRadioButton("enum", {
    getter: () => model.enum,
    setter: (v) => (model.enum = v as SampleEnum),
    });
    Object.values(SampleEnum).map((value) => (
    <input key={value} {...bind(value)} />
    ))
    bindSelectBox: RequiredConfig<T, typeof SelectBoxBinding>

    Bind the select box field to the form.

    <select
    {...form.bindSelectBox("single", {
    getter: () => model.code,
    setter: (v) => (model.code = v),
    })}
    >
    ...
    </select>
    bindSubmitButton: OptionalConfig<T, typeof SubmitButtonBinding>

    Bind the submit button to the form.

    <button {...form.bindSubmitButton()}>Submit</button>