@farris/ui-vue
Version:
Farris Vue, a Farris Design based Vue3 component library.
46 lines (45 loc) • 1.87 kB
TypeScript
/**
* Tabs 是标签页容器组件，通过切换标签，显示不同内容。内容区域可放置表格、Form、ListView 等。Tabs 纵向划分为：头部区域、内容区域。头部区域横向划分为：标题区、工具栏区。
*
* @example
* ```tsx
* import { defineComponent, ref } from 'vue';
* import { FButton } from '../../components/button';
* import { FTabs, FTabPage } from '../../components/tabs';
*
* export default defineComponent({
* name: 'BasicTsxDemo',
* setup() {
*
*
* const activeId = ref('tab2');
*
* const changeTabPage = () => {
* activeId.value = 'tab3';
* };
*
* return () => (
* <>
* <FButton onClick={changeTabPage}>切换标签页3</FButton>
* <FTabs modelValue={activeId.value} onUpdate:modelValue={(v: any) => { activeId.value = v; }}><FTabPage id="tab1" title="标签页 1"><div class="py-2"><p>标签页 1</p>
* <p>可以在此处放置其他控件、内容</p></div></FTabPage>
* <FTabPage id="tab2" title="标签页 2"><div class="py-2"><p>标签页2</p>
* <p>可以在此处放置其他控件、内容</p></div></FTabPage>
* <FTabPage id="tab3" title="标签页 3"><div class="py-2"><p>标签页3</p>
* <p>可以在此处放置其他控件、内容</p></div></FTabPage></FTabs>
* </>
* );
* }
* });
* ```
*
* @public
*/
declare const _default: import("vue").DefineComponent<{
[x: string]: any;
}, () => any, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
[x: string]: any;
}> & Readonly<{}>, {
[x: string]: any;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
export default _default;