Vue Tabs: Bộ thành phần tab có thể tái sử dụng cho Vue

Một plugin Vue giúp bạn tạo ra các thành phần tab có thể tái sử dụng giúp điều hướng mượt mà. Gói h-vue-tabs cung cấp một thành phần điều hướng tab linh hoạt và có thể tùy chỉnh cho ứng dụng Vue.js. Dễ dàng chuyển đổi giữa các tab và điều khiển tab hoạt động bằng router.

Ví dụ

thân thiện với thiết bị di động

Cài đặt

Ứng dụng Vue

Cài đặt:

yarn add h-vue-tabs

# or use npm

npm install h-vue-tabs

Sau đó, nhập và đăng ký thành phần:

# main.ts or main.js

import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import router from './router';

import HVuetabs from 'h-vue-tabs';
import 'h-vue-tabs/dist/style.css';

const app = createApp(App)
app.use(router)
app.use(HVuetabs);

app.mount('#app')

Đừng quên nhập tệp css import 'h-vue-tabs/dist/style.css'

Sử dụng

<script setup>
import { ref } from "vue";

const tabs = ref(['one', "two"])
</script>

<template>
  <Tab :tabs="tabs" :activeTabIndex="0" activeTabColor="red"></Tab>
</template>

Tham số của Thành phần

Chi tiết tải về:

Tác giả: Hannahadora
Nguồn: https://github.com/Hannahadora/h-vue-tabs

Giấy phép: MIT license

Cảm ơn bạn!