Skip to content

Commit ce11488

Browse files
committed
feat: menu support nest component
1 parent dae7513 commit ce11488

File tree

9 files changed

+98
-37
lines changed

9 files changed

+98
-37
lines changed

components/_util/store/connect.jsx

Lines changed: 35 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ function getDisplayName(WrappedComponent) {
99
}
1010

1111
const defaultMapStateToProps = () => ({});
12-
export default function connect(mapStateToProps) {
12+
export default function connect(mapStateToProps, injectExtraPropsKey) {
1313
const shouldSubscribe = !!mapStateToProps;
1414
const finalMapStateToProps = mapStateToProps || defaultMapStateToProps;
1515
return function wrapWithConnect(WrappedComponent) {
@@ -25,18 +25,43 @@ export default function connect(mapStateToProps) {
2525
props,
2626
inject: {
2727
storeContext: { default: () => ({}) },
28+
...(injectExtraPropsKey
29+
? {
30+
injectExtraContext: {
31+
from: injectExtraPropsKey,
32+
default: () => ({}),
33+
},
34+
}
35+
: {}),
36+
},
37+
computed: {
38+
injectExtraProps() {
39+
return this.injectExtraContext ? this.injectExtraContext.$attrs : {};
40+
},
41+
injectExtraListeners() {
42+
return this.injectExtraContext ? this.injectExtraContext.$listeners : {};
43+
},
2844
},
2945
data() {
3046
this.store = this.storeContext.store;
31-
this.preProps = omit(getOptionProps(this), ['__propsSymbol__']);
47+
this.preProps = {
48+
...omit(getOptionProps(this), ['__propsSymbol__']),
49+
...this.injectExtraProps,
50+
};
3251
return {
33-
subscribed: finalMapStateToProps(this.store.getState(), this.$props),
52+
subscribed: finalMapStateToProps(this.store.getState(), {
53+
...this.$props,
54+
...this.injectExtraProps,
55+
}),
3456
};
3557
},
3658
watch: {
3759
__propsSymbol__() {
3860
if (mapStateToProps && mapStateToProps.length === 2) {
39-
this.subscribed = finalMapStateToProps(this.store.getState(), this.$props);
61+
this.subscribed = finalMapStateToProps(this.store.getState(), {
62+
...this.$props,
63+
...this.injectExtraProps,
64+
});
4065
}
4166
},
4267
},
@@ -52,7 +77,10 @@ export default function connect(mapStateToProps) {
5277
if (!this.unsubscribe) {
5378
return;
5479
}
55-
const props = omit(getOptionProps(this), ['__propsSymbol__']);
80+
const props = {
81+
...omit(getOptionProps(this), ['__propsSymbol__']),
82+
...this.injectExtraProps,
83+
};
5684
const nextSubscribed = finalMapStateToProps(this.store.getState(), props);
5785
if (
5886
!shallowEqual(this.preProps, props) ||
@@ -81,15 +109,15 @@ export default function connect(mapStateToProps) {
81109
},
82110
render() {
83111
const { $slots = {}, $scopedSlots, subscribed, store } = this;
84-
const props = getOptionProps(this);
112+
const props = { ...getOptionProps(this), ...this.injectExtraProps };
85113
this.preProps = { ...omit(props, ['__propsSymbol__']) };
86114
const wrapProps = {
87115
props: {
88116
...props,
89117
...subscribed,
90118
store,
91119
},
92-
on: getListeners(this),
120+
on: { ...getListeners(this), ...this.injectExtraListeners },
93121
scopedSlots: $scopedSlots,
94122
};
95123
return (

components/layout/__tests__/__snapshots__/demo.test.js.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -322,7 +322,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/top-side.md correctly 1`] = `
322322
<div class="ant-layout-sider-children">
323323
<ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-light" style="height: 100%;">
324324
<li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-selected">
325-
<div aria-expanded="true" aria-owns="sub1$Menu" aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i>subnav 1</span><i class="ant-menu-submenu-arrow"></i></div>
325+
<div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;" aria-expanded="true" aria-owns="sub1$Menu"><span><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i>subnav 1</span><i class="ant-menu-submenu-arrow"></i></div>
326326
<ul role="menu" class="ant-menu ant-menu-inline ant-menu-sub">
327327
<li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 48px;">
328328
option1
@@ -393,7 +393,7 @@ exports[`renders ./antdv-demo/docs/layout/demo/top-side-2.md correctly 1`] = `
393393
<div class="ant-layout-sider-children">
394394
<ul role="menu" class="ant-menu ant-menu-inline ant-menu-root ant-menu-light" style="height: 100%; border-right: 0;">
395395
<li role="menuitem" class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open ant-menu-submenu-selected">
396-
<div aria-expanded="true" aria-owns="sub1$Menu" aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;"><span><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i>subnav 1</span><i class="ant-menu-submenu-arrow"></i></div>
396+
<div aria-haspopup="true" class="ant-menu-submenu-title" style="padding-left: 24px;" aria-expanded="true" aria-owns="sub1$Menu"><span><i aria-label="icon: user" class="anticon anticon-user"><svg viewBox="64 64 896 896" data-icon="user" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"></path></svg></i>subnav 1</span><i class="ant-menu-submenu-arrow"></i></div>
397397
<ul role="menu" class="ant-menu ant-menu-inline ant-menu-sub">
398398
<li role="menuitem" class="ant-menu-item ant-menu-item-selected" style="padding-left: 48px;">
399399
option1

0 commit comments

Comments
 (0)