Repository Description
This repository contains a quick‑start Vue sample that demonstrates how to create and configure the Syncfusion Vue Splitter component in a Vue application.
A quick‑start project that helps you create and configure the Syncfusion Vue Splitter component. This project includes example code to configure core features such as resizing, collapsing, and expanding panes, as well as rendering nested splitter panes for complex layout scenarios.
The purpose of this project is to help developers understand the basic usage and configuration of the Syncfusion Vue Splitter component. It demonstrates how the Splitter can be used to divide content into resizable and collapsible sections to build flexible and interactive layouts.
- Integration of the Syncfusion Vue Splitter component
- Resizable and collapsible panes
- Support for expandable split panes
- Ability to render nested splitter layouts
Make sure your development environment meets the following requirements:
- Visual Studio Code
- NodeJS (latest version recommended)
- Clone the repository.
git clone https://github.com/SyncfusionExamples/getting-started-with-the-vue-splitter-component.git- Open the project directory in Visual Studio Code.
- Install all required dependencies using:
npm install. - Run the project using:
npm run serve. - Open your browser and navigate to the URL shown in the terminal to view the Splitter output.
- General Syncfusion documentation:
https://help.syncfusion.com/ - Vue Introduction:
https://ej2.syncfusion.com/vue/documentation/introduction - Vue Splitter Getting Started:
https://ej2.syncfusion.com/vue/documentation/splitter/getting-started
- Ensure Node.js and npm are installed correctly.
- Run npm install again if dependency installation fails.
- Restart the development server if layout changes are not reflected.
- Check the browser console for runtime or configuration errors.
For API references, advanced configuration options, and additional examples, refer to the Syncfusion Vue documentation links provided above.