github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: wave's custom prefixCls not working (#5334)

pull/5340/head
showkw 2022-03-15 14:39:11 +08:00 committed by GitHub
parent a8d5dad362
commit 9b730ef5e2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/_util/wave.tsx
View File

@ -28,7 +28,7 @@ export default defineComponent({
}, },
setup(props, { slots, expose }) { setup(props, { slots, expose }) {
const instance = getCurrentInstance(); const instance = getCurrentInstance();
const { csp } = useConfigInject('', props); const { csp, prefixCls } = useConfigInject('', props);
expose({ expose({
csp, csp,
}); });
@ -58,7 +58,7 @@ export default defineComponent({
}; };
const getAttributeName = () => { const getAttributeName = () => {
const { insertExtraNode } = props; const { insertExtraNode } = props;
return insertExtraNode ? 'ant-click-animating' : 'ant-click-animating-without-extra-node'; return insertExtraNode ? `${prefixCls.value}-click-animating` : `${prefixCls.value}-click-animating-without-extra-node`;
}; };
const onClick = (node: HTMLElement, waveColor: string) => { const onClick = (node: HTMLElement, waveColor: string) => {
const { insertExtraNode, disabled } = props; const { insertExtraNode, disabled } = props;
@ -67,7 +67,7 @@ export default defineComponent({
} }
extraNode = document.createElement('div'); extraNode = document.createElement('div');
extraNode.className = 'ant-click-animating-node'; extraNode.className = `${prefixCls.value}-click-animating-node`;
const attributeName = getAttributeName(); const attributeName = getAttributeName();
node.removeAttribute(attributeName); node.removeAttribute(attributeName);
node.setAttribute(attributeName, 'true'); node.setAttribute(attributeName, 'true');
@ -87,7 +87,7 @@ export default defineComponent({
} }
extraNode.style.borderColor = waveColor; extraNode.style.borderColor = waveColor;
styleForPesudo.innerHTML = ` styleForPesudo.innerHTML = `
[ant-click-animating-without-extra-node='true']::after, .ant-click-animating-node { [${prefixCls.value}-click-animating-without-extra-node='true']::after, .${prefixCls.value}-click-animating-node {
--antd-wave-shadow-color: ${waveColor}; --antd-wave-shadow-color: ${waveColor};
}`; }`;
if (!document.body.contains(styleForPesudo)) { if (!document.body.contains(styleForPesudo)) {