본문으로 건너뛰기

activeBatch

Description

선택 사항. 에디터에서 현재 활성화된 입력 배치를 제어합니다

Usage

activeBatch?: string | number;

Examples

한 번에 하나의 배치 표시하기

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

registerEditorItem("combo", Combo);

const batchItems = [
{
comp: "text",
key: "name",
batch: "main",
label: "Name",
},
{
key: "theme",
batch: "cfg",
comp: "combo",
label: "Theme",
options: [
{ id: "light", label: "Light" },
{ id: "dark", label: "Dark" },
],
},
];

</script>

<Editor {items} activeBatch="cfg" />

탭바를 사용하여 표시 여부 제어하기

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

registerEditorItem("combo", Combo);

const options = [
{
id: "main",
label: "Personal",
},
{
id: "cfg",
label: "Settings",
},
];

const items = [
{
comp: "text",
key: "name",
batch: "main",
label: "Name",
},
{
key: "theme",
batch: "cfg",
comp: "combo",
label: "Theme",
options: [
{ id: "light", label: "Light" },
{ id: "dark", label: "Dark" },
],
},
];

const activeBatch = $state("cfg");
</script>

<Editor {items} {activeBatch}>
<Tabs {options} bind:value={activeBatch}></Tabs>
</Editor>