split-pane-v3

split-pane-v3

中文文档README.zh_CN.md

demo

About

• Split-pane-v3 is a split panel component based on VUE3+TS, this component functions similar to 'vscode' panel splitting, commonly found in online code editors! According to turn,this can be understood as the Vue3 version of the project.

Get Start

download

npm install split-pane-v3 --save

or

npm i split-pane-v3 -S

<template>
	<split-pane :min-percent="0" :default-percent="20" split="vertical">
		<template v-slot:paneL> vertical-A </template>
		<template v-slot:paneR>
			<split-pane split="horizontal" :default-percent="75">
				<template v-slot:paneL> horizontal-B </template>
				<template v-slot:paneR>
					<split-pane split="vertical" :default-percent="75">
						<template v-slot:paneL> vertical-C </template>
						<template v-slot:paneR> vertical-D </template>
					</split-pane>
				</template>
			</split-pane>
		</template>
	</split-pane>
</template>

<script setup lang="ts">
	import { defineAsyncComponent } from "vue";
	const SplitPane = defineAsyncComponent(() => import("split-pane-v3"));
</script>

Options

slot