@vrx-arco/pro-components
Version:
<p align="center"> <img src="https://vrx-arco.github.io/arco-design-pro/favicon.svg" width="200" height="250"> </p>
83 lines (82 loc) • 1.94 kB
JavaScript
import { defineComponent, createVNode } from "vue";
import { Layout, Tabs } from "@arco-design/web-vue";
import { injectSearchLayout } from "./context.mjs";
const SearchLayoutContent = /* @__PURE__ */ defineComponent({
name: "vrx-arco-search-layout-content",
props: {
/**
* 是否启用tab
*/
useTabs: Boolean,
/**
* tab配置
*/
tabs: {
type: Array,
default: () => []
},
/**
* tab类型
* @default rounded
*/
tabsType: {
type: String,
default: "rounded"
}
},
emits: {
/**
*
* @param key
*/
// @ts-ignore
// eslint-disable-next-line @typescript-eslint/no-unused-vars
tabChange: (key) => true
},
setup: (props, {
slots,
emit
}) => {
const {
bemClass
} = injectSearchLayout();
return () => {
const {
useTabs,
tabs,
tabsType
} = props;
return createVNode(Layout.Content, {
"class": bemClass("__content")
}, {
default: () => {
var _a;
return [useTabs ? createVNode(Tabs, {
"type": tabsType,
"lazyLoad": true,
"destroyOnHide": true,
"justify": true,
"animation": true,
"class": bemClass("__content--nav"),
"onChange": (key) => emit("tabChange", key)
}, {
default: () => [tabs.map((item) => createVNode(Tabs.TabPane, {
"key": item.key,
"title": item.title,
"disabled": item.disabled
}, {
default: () => {
var _a2;
return [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)];
}
}))],
extra: slots.tabExtra
}) : (_a = slots.default) == null ? void 0 : _a.call(slots)];
}
});
};
}
});
export {
SearchLayoutContent
};