Browse Source

feat: drawer 组件封装

main
xuziqiang 6 months ago
parent
commit
f7ebb4bd60
  1. 34
      lib/component/drawer/drawer.vue
  2. 4
      lib/component/drawer/index.ts
  3. 3
      lib/component/index.ts

34
lib/component/drawer/drawer.vue

@ -0,0 +1,34 @@
<!-- @format -->
<template>
<a-drawer v-bind="getBindValue">
<template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
<slot :name="item" v-bind="data || {}"></slot>
</template>
<template #footer>
<a-button>取消</a-button>
</template>
</a-drawer>
</template>
<script lang="ts">
import { computed, defineComponent, toRefs } from 'vue';
import { drawerProps } from 'ant-design-vue/es/drawer';
export default defineComponent({
name: 'NsDrawer',
props: {
...drawerProps(),
},
setup(props, { attrs, emit, slots }) {
console.log(props, slots);
const getBindValue = computed(() => ({
...attrs,
...props,
}));
return { getBindValue };
},
});
</script>
<style lang="less" scoped></style>

4
lib/component/drawer/index.ts

@ -0,0 +1,4 @@
import drawer from './drawer.vue';
import { withInstall } from '/nerv-lib/util';
export const NsDrawer = withInstall(drawer);

3
lib/component/index.ts

@ -1,5 +1,3 @@
export { export {
Button, Button,
Select, Select,
@ -68,6 +66,7 @@ export { NsSteps } from './form/steps';
export { NsVNode } from './VNode'; export { NsVNode } from './VNode';
export { NsMessage } from './message'; export { NsMessage } from './message';
export { NsModal } from './modal'; export { NsModal } from './modal';
export { NsDrawer } from './drawer';
export { NsForm } from './form/form'; export { NsForm } from './form/form';
export * from './table'; export * from './table';

Loading…
Cancel
Save