images/babel-plugin-jsx
2
0
Fork 0
mirror of https://github.com/vuejs/babel-plugin-jsx.git synced 2025-05-14 20:24:37 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: mergeProps order error

Browse Source
This commit is contained in:
Amour1688 2020-09-07 22:24:29 +08:00
parent f519920db2
commit bf59811f43
1 changed files with 14 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
packages/babel-plugin-jsx/src/buildProps.ts
View File

@ -12,7 +12,7 @@ import {
} from './utils'; } from './utils';
import parseDirectives from './parseDirectives'; import parseDirectives from './parseDirectives';
import { PatchFlags } from './patchFlags'; import { PatchFlags } from './patchFlags';
import { State, ExcludesBoolean } from '.'; import { State } from '.';
import { transformJSXElement } from './transform-vue-jsx'; import { transformJSXElement } from './transform-vue-jsx';
import SlotFlags from './slotFlags'; import SlotFlags from './slotFlags';
@ -136,7 +136,7 @@ const buildProps = (path: NodePath<t.JSXElement>, state: State) => {
}; };
} }
const properties: t.ObjectProperty[] = []; let properties: t.ObjectProperty[] = [];
// patchFlag analysis // patchFlag analysis
let hasRef = false; let hasRef = false;
@ -145,7 +145,7 @@ const buildProps = (path: NodePath<t.JSXElement>, state: State) => {
let hasHydrationEventBinding = false; let hasHydrationEventBinding = false;
let hasDynamicKeys = false; let hasDynamicKeys = false;
const mergeArgs: (t.CallExpression | t.ObjectProperty | t.Identifier)[] = []; const mergeArgs: (t.CallExpression | t.ObjectExpression | t.Identifier)[] = [];
props props
.forEach((prop) => { .forEach((prop) => {
if (prop.isJSXAttribute()) { if (prop.isJSXAttribute()) {
@ -263,15 +263,17 @@ const buildProps = (path: NodePath<t.JSXElement>, state: State) => {
dynamicPropNames.add(`onUpdate:${propName}`); dynamicPropNames.add(`onUpdate:${propName}`);
} }
return; } else {
if (name.match(xlinkRE)) {
name = name.replace(xlinkRE, (_, firstCharacter) => `xlink:${firstCharacter.toLowerCase()}`);
}
properties.push(t.objectProperty(
t.stringLiteral(name),
attributeValue || t.booleanLiteral(true),
));
} }
if (name.match(xlinkRE)) { mergeArgs.push(t.objectExpression(dedupeProperties(properties)));
name = name.replace(xlinkRE, (_, firstCharacter) => `xlink:${firstCharacter.toLowerCase()}`); properties = [];
}
properties.push(t.objectProperty(
t.stringLiteral(name),
attributeValue || t.booleanLiteral(true),
));
} else { } else {
// JSXSpreadAttribute // JSXSpreadAttribute
hasDynamicKeys = true; hasDynamicKeys = true;
@ -284,7 +286,6 @@ const buildProps = (path: NodePath<t.JSXElement>, state: State) => {
}); });
// patchFlag analysis // patchFlag analysis
// tslint:disable: no-bitwise
if (hasDynamicKeys) { if (hasDynamicKeys) {
patchFlag |= PatchFlags.FULL_PROPS; patchFlag |= PatchFlags.FULL_PROPS;
} else { } else {
@ -312,32 +313,15 @@ const buildProps = (path: NodePath<t.JSXElement>, state: State) => {
let propsExpression: t.Expression | t.ObjectProperty | t.Literal = t.nullLiteral(); let propsExpression: t.Expression | t.ObjectProperty | t.Literal = t.nullLiteral();
if (mergeArgs.length) { if (mergeArgs.length) {
if (properties.length) {
mergeArgs.push(...dedupeProperties(properties));
}
if (mergeArgs.length > 1) { if (mergeArgs.length > 1) {
const exps: (t.CallExpression | t.Identifier)[] = [];
const objectProperties: t.ObjectProperty[] = [];
mergeArgs.forEach((arg) => {
if (t.isIdentifier(arg) || t.isExpression(arg)) {
exps.push(arg);
} else {
objectProperties.push(arg);
}
});
propsExpression = t.callExpression( propsExpression = t.callExpression(
createIdentifier(state, 'mergeProps'), createIdentifier(state, 'mergeProps'),
[ mergeArgs,
...exps,
!!objectProperties.length && t.objectExpression(objectProperties),
].filter(Boolean as any as ExcludesBoolean),
); );
} else { } else {
// single no need for a mergeProps call // single no need for a mergeProps call
propsExpression = mergeArgs[0]; propsExpression = mergeArgs[0];
} }
} else if (properties.length) {
propsExpression = t.objectExpression(dedupeProperties(properties));
} }
return { return {