maj de vuejs
This commit is contained in:
parent
80fceaea04
commit
017391af7c
1 changed files with 95 additions and 56 deletions
145
js/vue.js
145
js/vue.js
|
@ -252,7 +252,7 @@ var Vue = (function (exports) {
|
|||
|
||||
const EMPTY_OBJ = Object.freeze({})
|
||||
;
|
||||
const EMPTY_ARR = [];
|
||||
const EMPTY_ARR = Object.freeze([]) ;
|
||||
const NOOP = () => { };
|
||||
/**
|
||||
* Always return false.
|
||||
|
@ -292,7 +292,9 @@ var Vue = (function (exports) {
|
|||
key !== 'NaN' &&
|
||||
key[0] !== '-' &&
|
||||
'' + parseInt(key, 10) === key;
|
||||
const isReservedProp = /*#__PURE__*/ makeMap('key,ref,' +
|
||||
const isReservedProp = /*#__PURE__*/ makeMap(
|
||||
// the leading comma is intentional so empty string "" is also included
|
||||
',key,ref,' +
|
||||
'onVnodeBeforeMount,onVnodeMounted,' +
|
||||
'onVnodeBeforeUpdate,onVnodeUpdated,' +
|
||||
'onVnodeBeforeUnmount,onVnodeUnmounted');
|
||||
|
@ -314,15 +316,15 @@ var Vue = (function (exports) {
|
|||
/**
|
||||
* @private
|
||||
*/
|
||||
const hyphenate = cacheStringFunction((str) => {
|
||||
return str.replace(hyphenateRE, '-$1').toLowerCase();
|
||||
});
|
||||
const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, '-$1').toLowerCase());
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
const capitalize = cacheStringFunction((str) => {
|
||||
return str.charAt(0).toUpperCase() + str.slice(1);
|
||||
});
|
||||
const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
const toHandlerKey = cacheStringFunction((str) => (str ? `on${capitalize(str)}` : ``));
|
||||
// compare whether a value has changed, accounting for NaN.
|
||||
const hasChanged = (value, oldValue) => value !== oldValue && (value === value || oldValue === oldValue);
|
||||
const invokeArrayFns = (fns, arg) => {
|
||||
|
@ -667,7 +669,7 @@ var Vue = (function (exports) {
|
|||
return result;
|
||||
}
|
||||
function ownKeys(target) {
|
||||
track(target, "iterate" /* ITERATE */, ITERATE_KEY);
|
||||
track(target, "iterate" /* ITERATE */, isArray(target) ? 'length' : ITERATE_KEY);
|
||||
return Reflect.ownKeys(target);
|
||||
}
|
||||
const mutableHandlers = {
|
||||
|
@ -1739,21 +1741,21 @@ var Vue = (function (exports) {
|
|||
exports.devtools.emit("component:emit" /* COMPONENT_EMIT */, component.appContext.app, component, event, params);
|
||||
}
|
||||
|
||||
function emit(instance, event, ...args) {
|
||||
function emit(instance, event, ...rawArgs) {
|
||||
const props = instance.vnode.props || EMPTY_OBJ;
|
||||
{
|
||||
const { emitsOptions, propsOptions: [propsOptions] } = instance;
|
||||
if (emitsOptions) {
|
||||
if (!(event in emitsOptions)) {
|
||||
if (!propsOptions || !(`on` + capitalize(event) in propsOptions)) {
|
||||
if (!propsOptions || !(toHandlerKey(event) in propsOptions)) {
|
||||
warn(`Component emitted event "${event}" but it is neither declared in ` +
|
||||
`the emits option nor as an "on${capitalize(event)}" prop.`);
|
||||
`the emits option nor as an "${toHandlerKey(event)}" prop.`);
|
||||
}
|
||||
}
|
||||
else {
|
||||
const validator = emitsOptions[event];
|
||||
if (isFunction(validator)) {
|
||||
const isValid = validator(...args);
|
||||
const isValid = validator(...rawArgs);
|
||||
if (!isValid) {
|
||||
warn(`Invalid event arguments: event validation failed for event "${event}".`);
|
||||
}
|
||||
|
@ -1761,12 +1763,26 @@ var Vue = (function (exports) {
|
|||
}
|
||||
}
|
||||
}
|
||||
let args = rawArgs;
|
||||
const isModelListener = event.startsWith('update:');
|
||||
// for v-model update:xxx events, apply modifiers on args
|
||||
const modelArg = isModelListener && event.slice(7);
|
||||
if (modelArg && modelArg in props) {
|
||||
const modifiersKey = `${modelArg === 'modelValue' ? 'model' : modelArg}Modifiers`;
|
||||
const { number, trim } = props[modifiersKey] || EMPTY_OBJ;
|
||||
if (trim) {
|
||||
args = rawArgs.map(a => a.trim());
|
||||
}
|
||||
else if (number) {
|
||||
args = rawArgs.map(toNumber);
|
||||
}
|
||||
}
|
||||
{
|
||||
devtoolsComponentEmit(instance, event, args);
|
||||
}
|
||||
{
|
||||
const lowerCaseEvent = event.toLowerCase();
|
||||
if (lowerCaseEvent !== event && props[`on` + capitalize(lowerCaseEvent)]) {
|
||||
if (lowerCaseEvent !== event && props[toHandlerKey(lowerCaseEvent)]) {
|
||||
warn(`Event "${lowerCaseEvent}" is emitted in component ` +
|
||||
`${formatComponentName(instance, instance.type)} but the handler is registered for "${event}". ` +
|
||||
`Note that HTML attributes are case-insensitive and you cannot use ` +
|
||||
|
@ -1775,25 +1791,26 @@ var Vue = (function (exports) {
|
|||
}
|
||||
}
|
||||
// convert handler name to camelCase. See issue #2249
|
||||
let handlerName = `on${capitalize(camelize(event))}`;
|
||||
let handlerName = toHandlerKey(camelize(event));
|
||||
let handler = props[handlerName];
|
||||
// for v-model update:xxx events, also trigger kebab-case equivalent
|
||||
// for props passed via kebab-case
|
||||
if (!handler && event.startsWith('update:')) {
|
||||
handlerName = `on${capitalize(hyphenate(event))}`;
|
||||
if (!handler && isModelListener) {
|
||||
handlerName = toHandlerKey(hyphenate(event));
|
||||
handler = props[handlerName];
|
||||
}
|
||||
if (!handler) {
|
||||
handler = props[handlerName + `Once`];
|
||||
if (handler) {
|
||||
callWithAsyncErrorHandling(handler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
|
||||
}
|
||||
const onceHandler = props[handlerName + `Once`];
|
||||
if (onceHandler) {
|
||||
if (!instance.emitted) {
|
||||
(instance.emitted = {})[handlerName] = true;
|
||||
}
|
||||
else if (instance.emitted[handlerName]) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (handler) {
|
||||
callWithAsyncErrorHandling(handler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
|
||||
callWithAsyncErrorHandling(onceHandler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
|
||||
}
|
||||
}
|
||||
function normalizeEmitsOptions(comp, appContext, asMixin = false) {
|
||||
|
@ -2003,11 +2020,13 @@ var Vue = (function (exports) {
|
|||
const dynamicIndex = dynamicChildren ? dynamicChildren.indexOf(childRoot) : -1;
|
||||
const setRoot = (updatedRoot) => {
|
||||
rawChildren[index] = updatedRoot;
|
||||
if (dynamicChildren) {
|
||||
if (dynamicIndex > -1) {
|
||||
dynamicChildren[dynamicIndex] = updatedRoot;
|
||||
}
|
||||
else if (dynamicChildren && updatedRoot.patchFlag > 0) {
|
||||
dynamicChildren.push(updatedRoot);
|
||||
else if (updatedRoot.patchFlag > 0) {
|
||||
vnode.dynamicChildren = [...dynamicChildren, updatedRoot];
|
||||
}
|
||||
}
|
||||
};
|
||||
return [normalizeVNode(childRoot), setRoot];
|
||||
|
@ -2145,7 +2164,7 @@ var Vue = (function (exports) {
|
|||
mountSuspense(n2, container, anchor, parentComponent, parentSuspense, isSVG, optimized, rendererInternals);
|
||||
}
|
||||
else {
|
||||
patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, optimized, rendererInternals);
|
||||
patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, rendererInternals);
|
||||
}
|
||||
},
|
||||
hydrate: hydrateSuspense,
|
||||
|
@ -2159,13 +2178,13 @@ var Vue = (function (exports) {
|
|||
const hiddenContainer = createElement('div');
|
||||
const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, isSVG, optimized, rendererInternals));
|
||||
// start mounting the content subtree in an off-dom container
|
||||
patch(null, (suspense.pendingBranch = vnode.ssContent), hiddenContainer, null, parentComponent, suspense, isSVG, optimized);
|
||||
patch(null, (suspense.pendingBranch = vnode.ssContent), hiddenContainer, null, parentComponent, suspense, isSVG);
|
||||
// now check if we have encountered any async deps
|
||||
if (suspense.deps > 0) {
|
||||
// has async
|
||||
// mount the fallback tree
|
||||
patch(null, vnode.ssFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
|
||||
isSVG, optimized);
|
||||
isSVG);
|
||||
setActiveBranch(suspense, vnode.ssFallback);
|
||||
}
|
||||
else {
|
||||
|
@ -2173,7 +2192,7 @@ var Vue = (function (exports) {
|
|||
suspense.resolve();
|
||||
}
|
||||
}
|
||||
function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, optimized, { p: patch, um: unmount, o: { createElement } }) {
|
||||
function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, { p: patch, um: unmount, o: { createElement } }) {
|
||||
const suspense = (n2.suspense = n1.suspense);
|
||||
suspense.vnode = n2;
|
||||
n2.el = n1.el;
|
||||
|
@ -2184,13 +2203,13 @@ var Vue = (function (exports) {
|
|||
suspense.pendingBranch = newBranch;
|
||||
if (isSameVNodeType(newBranch, pendingBranch)) {
|
||||
// same root type but content may have changed.
|
||||
patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, optimized);
|
||||
patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
|
||||
if (suspense.deps <= 0) {
|
||||
suspense.resolve();
|
||||
}
|
||||
else if (isInFallback) {
|
||||
patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
|
||||
isSVG, optimized);
|
||||
isSVG);
|
||||
setActiveBranch(suspense, newFallback);
|
||||
}
|
||||
}
|
||||
|
@ -2216,25 +2235,25 @@ var Vue = (function (exports) {
|
|||
suspense.hiddenContainer = createElement('div');
|
||||
if (isInFallback) {
|
||||
// already in fallback state
|
||||
patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, optimized);
|
||||
patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
|
||||
if (suspense.deps <= 0) {
|
||||
suspense.resolve();
|
||||
}
|
||||
else {
|
||||
patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
|
||||
isSVG, optimized);
|
||||
isSVG);
|
||||
setActiveBranch(suspense, newFallback);
|
||||
}
|
||||
}
|
||||
else if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
|
||||
// toggled "back" to current active branch
|
||||
patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, optimized);
|
||||
patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG);
|
||||
// force resolve
|
||||
suspense.resolve(true);
|
||||
}
|
||||
else {
|
||||
// switched to a 3rd branch
|
||||
patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, optimized);
|
||||
patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
|
||||
if (suspense.deps <= 0) {
|
||||
suspense.resolve();
|
||||
}
|
||||
|
@ -2244,7 +2263,7 @@ var Vue = (function (exports) {
|
|||
else {
|
||||
if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
|
||||
// root did not change, just normal patch
|
||||
patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, optimized);
|
||||
patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG);
|
||||
setActiveBranch(suspense, newBranch);
|
||||
}
|
||||
else {
|
||||
|
@ -2257,7 +2276,7 @@ var Vue = (function (exports) {
|
|||
// mount pending branch in off-dom container
|
||||
suspense.pendingBranch = newBranch;
|
||||
suspense.pendingId++;
|
||||
patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, optimized);
|
||||
patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
|
||||
if (suspense.deps <= 0) {
|
||||
// incoming branch has no async deps, resolve now.
|
||||
suspense.resolve();
|
||||
|
@ -2293,7 +2312,6 @@ var Vue = (function (exports) {
|
|||
parent,
|
||||
parentComponent,
|
||||
isSVG,
|
||||
optimized,
|
||||
container,
|
||||
hiddenContainer,
|
||||
anchor,
|
||||
|
@ -2376,7 +2394,7 @@ var Vue = (function (exports) {
|
|||
if (!suspense.pendingBranch) {
|
||||
return;
|
||||
}
|
||||
const { vnode, activeBranch, parentComponent, container, isSVG, optimized } = suspense;
|
||||
const { vnode, activeBranch, parentComponent, container, isSVG } = suspense;
|
||||
// invoke @fallback event
|
||||
const onFallback = vnode.props && vnode.props.onFallback;
|
||||
if (isFunction(onFallback)) {
|
||||
|
@ -2389,7 +2407,7 @@ var Vue = (function (exports) {
|
|||
}
|
||||
// mount the fallback tree
|
||||
patch(null, fallbackVNode, container, anchor, parentComponent, null, // fallback tree will not have suspense context
|
||||
isSVG, optimized);
|
||||
isSVG);
|
||||
setActiveBranch(suspense, fallbackVNode);
|
||||
};
|
||||
const delayEnter = fallbackVNode.transition && fallbackVNode.transition.mode === 'out-in';
|
||||
|
@ -3058,7 +3076,7 @@ var Vue = (function (exports) {
|
|||
return wrappedHook;
|
||||
}
|
||||
else {
|
||||
const apiName = `on${capitalize(ErrorTypeStrings[type].replace(/ hook$/, ''))}`;
|
||||
const apiName = toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, ''));
|
||||
warn(`${apiName} is called when there is no active component instance to be ` +
|
||||
`associated with. ` +
|
||||
`Lifecycle injection APIs can only be used during execution of setup().` +
|
||||
|
@ -4984,6 +5002,7 @@ var Vue = (function (exports) {
|
|||
const patchProps = (el, vnode, oldProps, newProps, parentComponent, parentSuspense, isSVG) => {
|
||||
if (oldProps !== newProps) {
|
||||
for (const key in newProps) {
|
||||
// empty string is not valid prop
|
||||
if (isReservedProp(key))
|
||||
continue;
|
||||
const next = newProps[key];
|
||||
|
@ -5623,7 +5642,10 @@ var Vue = (function (exports) {
|
|||
// fast path for block nodes: only need to unmount dynamic children.
|
||||
unmountChildren(dynamicChildren, parentComponent, parentSuspense, false, true);
|
||||
}
|
||||
else if (!optimized && shapeFlag & 16 /* ARRAY_CHILDREN */) {
|
||||
else if ((type === Fragment &&
|
||||
(patchFlag & 128 /* KEYED_FRAGMENT */ ||
|
||||
patchFlag & 256 /* UNKEYED_FRAGMENT */)) ||
|
||||
(!optimized && shapeFlag & 16 /* ARRAY_CHILDREN */)) {
|
||||
unmountChildren(children, parentComponent, parentSuspense);
|
||||
}
|
||||
// an unmounted teleport should always remove its children if not disabled
|
||||
|
@ -6518,7 +6540,7 @@ var Vue = (function (exports) {
|
|||
: incoming;
|
||||
}
|
||||
}
|
||||
else {
|
||||
else if (key !== '') {
|
||||
ret[key] = toMerge[key];
|
||||
}
|
||||
}
|
||||
|
@ -6552,8 +6574,13 @@ var Vue = (function (exports) {
|
|||
// a functional component
|
||||
const instance = currentInstance || currentRenderingInstance;
|
||||
if (instance) {
|
||||
const provides = instance.provides;
|
||||
if (key in provides) {
|
||||
// #2400
|
||||
// to support `app.use` plugins,
|
||||
// fallback to appContext's `provides` if the intance is at root
|
||||
const provides = instance.parent == null
|
||||
? instance.vnode.appContext && instance.vnode.appContext.provides
|
||||
: instance.parent.provides;
|
||||
if (provides && key in provides) {
|
||||
// TS doesn't allow symbol as index type
|
||||
return provides[key];
|
||||
}
|
||||
|
@ -7317,7 +7344,7 @@ var Vue = (function (exports) {
|
|||
}
|
||||
}
|
||||
// 0. create render proxy property access cache
|
||||
instance.accessCache = {};
|
||||
instance.accessCache = Object.create(null);
|
||||
// 1. create public instance / render proxy
|
||||
// also mark it raw so it's never observed
|
||||
instance.proxy = new Proxy(instance.ctx, PublicInstanceProxyHandlers);
|
||||
|
@ -7913,7 +7940,7 @@ var Vue = (function (exports) {
|
|||
return ret;
|
||||
}
|
||||
for (const key in obj) {
|
||||
ret[`on${capitalize(key)}`] = obj[key];
|
||||
ret[toHandlerKey(key)] = obj[key];
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
|
@ -7940,7 +7967,7 @@ var Vue = (function (exports) {
|
|||
}
|
||||
|
||||
// Core API ------------------------------------------------------------------
|
||||
const version = "3.0.1";
|
||||
const version = "3.0.2";
|
||||
/**
|
||||
* SSR utils for \@vue/server-renderer. Only exposed in cjs builds.
|
||||
* @internal
|
||||
|
@ -9276,6 +9303,7 @@ var Vue = (function (exports) {
|
|||
const TO_HANDLERS = Symbol( `toHandlers` );
|
||||
const CAMELIZE = Symbol( `camelize` );
|
||||
const CAPITALIZE = Symbol( `capitalize` );
|
||||
const TO_HANDLER_KEY = Symbol( `toHandlerKey` );
|
||||
const SET_BLOCK_TRACKING = Symbol( `setBlockTracking` );
|
||||
const PUSH_SCOPE_ID = Symbol( `pushScopeId` );
|
||||
const POP_SCOPE_ID = Symbol( `popScopeId` );
|
||||
|
@ -9308,6 +9336,7 @@ var Vue = (function (exports) {
|
|||
[TO_HANDLERS]: `toHandlers`,
|
||||
[CAMELIZE]: `camelize`,
|
||||
[CAPITALIZE]: `capitalize`,
|
||||
[TO_HANDLER_KEY]: `toHandlerKey`,
|
||||
[SET_BLOCK_TRACKING]: `setBlockTracking`,
|
||||
[PUSH_SCOPE_ID]: `pushScopeId`,
|
||||
[POP_SCOPE_ID]: `popScopeId`,
|
||||
|
@ -9464,7 +9493,7 @@ var Vue = (function (exports) {
|
|||
}
|
||||
const nonIdentifierRE = /^\d|[^\$\w]/;
|
||||
const isSimpleIdentifier = (name) => !nonIdentifierRE.test(name);
|
||||
const memberExpRE = /^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*|\[[^\]]+\])*$/;
|
||||
const memberExpRE = /^[A-Za-z_$][\w$]*(?:\s*\.\s*[A-Za-z_$][\w$]*|\[[^\]]+\])*$/;
|
||||
const isMemberExpression = (path) => {
|
||||
if (!path)
|
||||
return false;
|
||||
|
@ -12481,12 +12510,12 @@ var Vue = (function (exports) {
|
|||
if (arg.isStatic) {
|
||||
const rawName = arg.content;
|
||||
// for all event listeners, auto convert it to camelCase. See issue #2249
|
||||
const normalizedName = capitalize(camelize(rawName));
|
||||
eventName = createSimpleExpression(`on${normalizedName}`, true, arg.loc);
|
||||
eventName = createSimpleExpression(toHandlerKey(camelize(rawName)), true, arg.loc);
|
||||
}
|
||||
else {
|
||||
// #2388
|
||||
eventName = createCompoundExpression([
|
||||
`"on" + ${context.helperString(CAPITALIZE)}(`,
|
||||
`${context.helperString(TO_HANDLER_KEY)}(`,
|
||||
arg,
|
||||
`)`
|
||||
]);
|
||||
|
@ -12495,7 +12524,7 @@ var Vue = (function (exports) {
|
|||
else {
|
||||
// already a compound expression.
|
||||
eventName = arg;
|
||||
eventName.children.unshift(`"on" + ${context.helperString(CAPITALIZE)}(`);
|
||||
eventName.children.unshift(`${context.helperString(TO_HANDLER_KEY)}(`);
|
||||
eventName.children.push(`)`);
|
||||
}
|
||||
// handler processing
|
||||
|
@ -12544,6 +12573,13 @@ var Vue = (function (exports) {
|
|||
const transformBind = (dir, node, context) => {
|
||||
const { exp, modifiers, loc } = dir;
|
||||
const arg = dir.arg;
|
||||
if (arg.type !== 4 /* SIMPLE_EXPRESSION */) {
|
||||
arg.children.unshift(`(`);
|
||||
arg.children.push(`) || ""`);
|
||||
}
|
||||
else if (!arg.isStatic) {
|
||||
arg.content = `${arg.content} || ""`;
|
||||
}
|
||||
// .prop is no longer necessary due to new patch behavior
|
||||
// .sync is replaced by v-model:arg
|
||||
if (modifiers.includes('camel')) {
|
||||
|
@ -12935,7 +12971,9 @@ var Vue = (function (exports) {
|
|||
}
|
||||
return {
|
||||
props: [
|
||||
createObjectProperty(createSimpleExpression(`textContent`, true, loc), exp || createSimpleExpression('', true))
|
||||
createObjectProperty(createSimpleExpression(`textContent`, true), exp
|
||||
? createCallExpression(context.helperString(TO_DISPLAY_STRING), [exp], loc)
|
||||
: createSimpleExpression('', true))
|
||||
]
|
||||
};
|
||||
};
|
||||
|
@ -13337,6 +13375,7 @@ var Vue = (function (exports) {
|
|||
exports.ssrContextKey = ssrContextKey;
|
||||
exports.ssrUtils = ssrUtils;
|
||||
exports.toDisplayString = toDisplayString;
|
||||
exports.toHandlerKey = toHandlerKey;
|
||||
exports.toHandlers = toHandlers;
|
||||
exports.toRaw = toRaw;
|
||||
exports.toRef = toRef;
|
||||
|
|
Loading…
Add table
Reference in a new issue