Skip to main content

values

Description​

Optional. Defines the initial values for the editor fields

Usage​

values: { [key: string]: any };

Examples​

Initializing editor with values​

<script>
    import { Editor, registerEditorItem } from "@svar-ui/svelte-editor";
    import { TextArea, Checkbox } from "@svar-ui/svelte-core";
    
    registerEditorItem("textarea", TextArea);
    registerEditorItem("checkbox", Checkbox);

    const items = [
        { comp: "text", key: "name", label: "Name" },
        {
            comp: "textarea",
            key: "descr",
            label: "Description"
        },
        { comp: "checkbox", key: "admin", label: "Is Admin" }
    ];

    const values = {
        name: "John Doe",
        descr: "Lorem ipsum dolor sit amet",
        admin: true,
        role: "admin"
    };
</script>

<Editor {items} {values} />

Adding top bar and using form values​

<script>
    import { Editor } from "@svar-ui/svelte-editor";

    const topBar = {
        items: [
            { comp: "label", spacer: true, key: "label" },
            { comp: Switch, key: "state" },
        ],
    };

    const values = {
        label: "Product N1",
        state: false
    };
</script>

<Editor {topBar} {values} />