refactor(compiler/runtime-vapor): remove unnecessary slot key (#225)

Author: Doctor-wu

packages/compiler-vapor/__tests__/transforms/__snapshots__/vSlot.spec.ts.snap

@@ -65,25 +65,22 @@ export function render(_ctx) {
       fn: () => {
         const n0 = t0()
         return n0
-      }, 
-      key: "0"
+      }
     }
     : _ctx.anotherCondition
       ? {
         name: "condition", 
         fn: _withDestructure(({ foo, bar }) => [foo, bar], (_ctx0) => {
           const n2 = t1()
           return n2
-        }), 
-        key: "1"
+        })
       }
       : {
         name: "condition", 
         fn: () => {
           const n4 = t2()
           return n4
-        }, 
-        key: "2"
+        }
       })], true)
   return n6
 }"

packages/compiler-vapor/__tests__/transforms/vSlot.spec.ts

@@ -290,7 +290,6 @@ describe('compiler: transform slot', () => {
             loop: {
               source: { content: 'list' },
               value: { content: 'item' },
-              key: undefined,
               index: undefined,
             },
           },
@@ -323,7 +322,6 @@ describe('compiler: transform slot', () => {
             loop: {
               source: { content: 'list' },
               value: undefined,
-              key: undefined,
               index: {
                 type: NodeTypes.SIMPLE_EXPRESSION,
               },
@@ -359,16 +357,14 @@ describe('compiler: transform slot', () => {
             condition: { content: 'condition' },
             positive: {
               slotType: DynamicSlotType.BASIC,
-              key: 0,
             },
             negative: {
               slotType: DynamicSlotType.CONDITIONAL,
               condition: { content: 'anotherCondition' },
               positive: {
                 slotType: DynamicSlotType.BASIC,
-                key: 1,
               },
-              negative: { slotType: DynamicSlotType.BASIC, key: 2 },
+              negative: { slotType: DynamicSlotType.BASIC },
             },
           },
         ],

packages/compiler-vapor/src/generators/component.ts

@@ -199,12 +199,11 @@ function genBasicDynamicSlot(
   slot: ComponentBasicDynamicSlot,
   context: CodegenContext,
 ): CodeFragment[] {
-  const { name, fn, key } = slot
+  const { name, fn } = slot
   return genMulti(
     DELIMITERS_OBJECT_NEWLINE,
     ['name: ', ...genExpression(name, context)],
     ['fn: ', ...genSlotBlockWithProps(fn, context)],
-    ...(key !== undefined ? [`key: "${key}"`] : []),
   )
 }
 

packages/compiler-vapor/src/ir.ts

@@ -222,7 +222,6 @@ export interface ComponentBasicDynamicSlot {
   slotType: DynamicSlotType.BASIC
   name: SimpleExpressionNode
   fn: ComponentSlotBlockIRNode
-  key?: number
 }
 
 export interface ComponentLoopDynamicSlot {

packages/compiler-vapor/src/transforms/vSlot.ts

@@ -135,7 +135,6 @@ export const transformVSlot: NodeTransform = (node, context) => {
           slotType: DynamicSlotType.BASIC,
           name: arg!,
           fn: block,
-          key: 0,
         },
       })
     } else if (vElse) {
@@ -157,14 +156,12 @@ export const transformVSlot: NodeTransform = (node, context) => {
                 slotType: DynamicSlotType.BASIC,
                 name: arg!,
                 fn: block,
-                key: ifNode.positive.key! + 1,
               },
             }
           : {
               slotType: DynamicSlotType.BASIC,
               name: arg!,
               fn: block,
-              key: ifNode.positive.key! + 1,
             }
         ifNode.negative = negative
       } else {

packages/runtime-vapor/src/componentSlots.ts

@@ -30,7 +30,6 @@ export type Slots = Readonly<InternalSlots>
 export interface DynamicSlot {
   name: string
   fn: Slot
-  key?: string
 }
 
 type DynamicSlotFn = () => DynamicSlot | DynamicSlot[]
@@ -72,17 +71,7 @@ export function initSlots(
           }
         } else if (dynamicSlot) {
           // conditional single slot generated by <template v-if="..." #foo>
-          slots[dynamicSlot.name] = withCtx(
-            dynamicSlot.key
-              ? (...args: any[]) => {
-                  const res = dynamicSlot.fn(...args)
-                  // attach branch key so each conditional branch is considered a
-                  // different fragment
-                  if (res) (res as any).key = dynamicSlot.key
-                  return res
-                }
-              : dynamicSlot.fn,
-          )
+          slots[dynamicSlot.name] = withCtx(dynamicSlot.fn)
           slotRecord[dynamicSlot.name] = true
         }
         // delete stale slots