diff --git a/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap index a9591f922b4..db268af4f9b 100644 --- a/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap +++ b/packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap @@ -19,12 +19,12 @@ export function render(_ctx, _cache) { }" `; -exports[`compiler: codegen > CacheExpression w/ isVNode: true 1`] = ` +exports[`compiler: codegen > CacheExpression w/ isVOnce: true 1`] = ` " export function render(_ctx, _cache) { return _cache[1] || ( _setBlockTracking(-1), - _cache[1] = foo, + (_cache[1] = foo).cacheIndex = 1, _setBlockTracking(1), _cache[1] ) diff --git a/packages/compiler-core/__tests__/codegen.spec.ts b/packages/compiler-core/__tests__/codegen.spec.ts index 4a5ba7d5c61..7724d507cb2 100644 --- a/packages/compiler-core/__tests__/codegen.spec.ts +++ b/packages/compiler-core/__tests__/codegen.spec.ts @@ -437,7 +437,7 @@ describe('compiler: codegen', () => { expect(code).toMatchSnapshot() }) - test('CacheExpression w/ isVNode: true', () => { + test('CacheExpression w/ isVOnce: true', () => { const { code } = generate( createRoot({ cached: 1, @@ -456,7 +456,7 @@ describe('compiler: codegen', () => { ` _cache[1] || ( _setBlockTracking(-1), - _cache[1] = foo, + (_cache[1] = foo).cacheIndex = 1, _setBlockTracking(1), _cache[1] ) diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap index 1c1203552db..3d13c4066d9 100644 --- a/packages/compiler-core/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap +++ b/packages/compiler-core/__tests__/transforms/__snapshots__/vOnce.spec.ts.snap @@ -9,7 +9,7 @@ return function render(_ctx, _cache) { return _cache[0] || ( _setBlockTracking(-1), - _cache[0] = _createElementVNode("div", { id: foo }, null, 8 /* PROPS */, ["id"]), + (_cache[0] = _createElementVNode("div", { id: foo }, null, 8 /* PROPS */, ["id"])).cacheIndex = 0, _setBlockTracking(1), _cache[0] ) @@ -29,7 +29,7 @@ return function render(_ctx, _cache) { return (_openBlock(), _createElementBlock("div", null, [ _cache[0] || ( _setBlockTracking(-1), - _cache[0] = _createVNode(_component_Comp, { id: foo }, null, 8 /* PROPS */, ["id"]), + (_cache[0] = _createVNode(_component_Comp, { id: foo }, null, 8 /* PROPS */, ["id"])).cacheIndex = 0, _setBlockTracking(1), _cache[0] ) @@ -48,7 +48,7 @@ return function render(_ctx, _cache) { return (_openBlock(), _createElementBlock("div", null, [ _cache[0] || ( _setBlockTracking(-1), - _cache[0] = _createElementVNode("div", { id: foo }, null, 8 /* PROPS */, ["id"]), + (_cache[0] = _createElementVNode("div", { id: foo }, null, 8 /* PROPS */, ["id"])).cacheIndex = 0, _setBlockTracking(1), _cache[0] ) @@ -67,7 +67,7 @@ return function render(_ctx, _cache) { return (_openBlock(), _createElementBlock("div", null, [ _cache[0] || ( _setBlockTracking(-1), - _cache[0] = _renderSlot($slots, "default"), + (_cache[0] = _renderSlot($slots, "default")).cacheIndex = 0, _setBlockTracking(1), _cache[0] ) @@ -86,7 +86,7 @@ return function render(_ctx, _cache) { return (_openBlock(), _createElementBlock("div", null, [ _cache[0] || ( _setBlockTracking(-1), - _cache[0] = _createElementVNode("div"), + (_cache[0] = _createElementVNode("div")).cacheIndex = 0, _setBlockTracking(1), _cache[0] ) diff --git a/packages/compiler-core/src/codegen.ts b/packages/compiler-core/src/codegen.ts index 392896d6082..b6535c5cef9 100644 --- a/packages/compiler-core/src/codegen.ts +++ b/packages/compiler-core/src/codegen.ts @@ -1041,11 +1041,12 @@ function genCacheExpression(node: CacheExpression, context: CodegenContext) { indent() push(`${helper(SET_BLOCK_TRACKING)}(-1),`) newline() + push(`(`) } push(`_cache[${node.index}] = `) genNode(node.value, context) if (node.isVOnce) { - push(`,`) + push(`).cacheIndex = ${node.index},`) newline() push(`${helper(SET_BLOCK_TRACKING)}(1),`) newline() diff --git a/packages/runtime-core/__tests__/rendererOptimizedMode.spec.ts b/packages/runtime-core/__tests__/rendererOptimizedMode.spec.ts index 7abd94e1960..e0b49a5e7eb 100644 --- a/packages/runtime-core/__tests__/rendererOptimizedMode.spec.ts +++ b/packages/runtime-core/__tests__/rendererOptimizedMode.spec.ts @@ -25,6 +25,7 @@ import { renderList, renderSlot, serialize, + setBlockTracking, withCtx, } from '@vue/runtime-test' import { PatchFlags, SlotFlags } from '@vue/shared' @@ -1178,4 +1179,57 @@ describe('renderer: optimized mode', () => { await nextTick() expect(inner(root)).toBe('