vuecssuiant-designantdreactantantd-vueenterprisefrontendui-designvue-antdvue-antd-uivue3vuecomponent
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
45 lines
1.3 KiB
45 lines
1.3 KiB
import { defineComponent } from 'vue'; |
|
import classNames from '../_util/classNames'; |
|
import PropTypes from '../_util/vue-types'; |
|
import { OverflowContextProvider, useInjectOverflowContext } from './context'; |
|
import Item from './Item'; |
|
|
|
export default defineComponent({ |
|
name: 'RawItem', |
|
inheritAttrs: false, |
|
props: { |
|
component: PropTypes.any, |
|
title: PropTypes.any, |
|
}, |
|
setup(props, { slots, attrs }) { |
|
const context = useInjectOverflowContext(); |
|
|
|
return () => { |
|
// Render directly when context not provided |
|
if (!context.value) { |
|
const { component: Component = 'div', ...restProps } = props; |
|
return ( |
|
<Component {...restProps} {...attrs}> |
|
{slots.default?.()} |
|
</Component> |
|
); |
|
} |
|
|
|
const { className: contextClassName, ...restContext } = context.value; |
|
const { class: className, ...restProps } = attrs; |
|
// Do not pass context to sub item to avoid multiple measure |
|
return ( |
|
<OverflowContextProvider value={null}> |
|
<Item |
|
class={classNames(contextClassName, className)} |
|
{...restContext} |
|
{...restProps} |
|
{...props} |
|
> |
|
{slots.default?.()} |
|
</Item> |
|
</OverflowContextProvider> |
|
); |
|
}; |
|
}, |
|
});
|
|
|