mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2024-12-21 04:50:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(cascader): clean code

Browse Source
This commit is contained in:
07akioni 2021-09-09 00:17:18 +08:00
parent 305538f402
commit 3b50cc4c68
1 changed files with 56 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

118
src/cascader/src/CascaderMenu.tsx
View File

@ -132,70 +132,64 @@ export default defineComponent({
return (
<Transition name="fade-in-scale-up-transition" appear={this.isMounted}>
{{
default: () =>
this.show
? withDirectives(
default: () => {
if (!this.show) return null
return withDirectives(
<div
tabindex="0"
ref="selfElRef"
class={`${mergedClsPrefix}-cascader-menu`}
onMousedown={this.onMousedown}
onFocusin={this.handleFocusin}
onFocusout={this.handleFocusout}
onKeyup={this.onKeyup}
style={
{
'--col-count': this.menuModel.length
} as any
}
>
{this.menuModel[0].length ? (
<div class={`${mergedClsPrefix}-cascader-submenu-wrapper`}>
{this.menuModel.map((submenuOptions, index) => (
<NCascaderSubmenu
ref={
((instance: CascaderSubmenuInstance) => {
if (instance) {
submenuInstRefs[index] = instance
}
}) as any
}
key={index}
tmNodes={submenuOptions}
depth={index + 1}
/>
))}
<NBaseMenuMask
clsPrefix={mergedClsPrefix}
ref="maskInstRef"
/>
</div>
) : (
<div class={`${mergedClsPrefix}-cascader-menu__empty`}>
{renderSlot($slots, 'empty', undefined, () => [<NEmpty />])}
</div>
)}
{$slots.action && (
<div
tabindex="0"
ref="selfElRef"
class={`${mergedClsPrefix}-cascader-menu`}
onMousedown={this.onMousedown}
onFocusin={this.handleFocusin}
onFocusout={this.handleFocusout}
onKeyup={this.onKeyup}
style={
{
'--col-count': this.menuModel.length
} as any
}
class={`${mergedClsPrefix}-cascader-menu-action`}
data-action
>
{this.menuModel[0].length ? (
<div
class={`${mergedClsPrefix}-cascader-submenu-wrapper`}
>
{this.menuModel.map((submenuOptions, index) => {
return (
<NCascaderSubmenu
ref={
((instance: CascaderSubmenuInstance) => {
if (instance) {
submenuInstRefs[index] = instance
}
}) as any
}
key={index}
tmNodes={submenuOptions}
depth={index + 1}
/>
)
})}
<NBaseMenuMask
clsPrefix={mergedClsPrefix}
ref="maskInstRef"
/>
</div>
) : (
<div class={`${mergedClsPrefix}-cascader-menu__empty`}>
{renderSlot($slots, 'empty', undefined, () => [
<NEmpty />
])}
</div>
)}
{$slots.action ? (
<div
class={`${mergedClsPrefix}-cascader-menu-action`}
data-action
>
{{
default: $slots.action
}}
</div>
) : null}
<FocusDetector onFocus={this.onTabout} />
</div>,
[[clickoutside, this.handleClickOutside]]
)
: null
{{
default: $slots.action
}}
</div>
)}
<FocusDetector onFocus={this.onTabout} />
</div>,
[[clickoutside, this.handleClickOutside]]
)
}
}}
</Transition>
)