fix(require-explicit-slots): ignore attribute binding

Author: waynzh

lib/rules/require-explicit-slots.js

@@ -137,13 +137,27 @@ module.exports = {
         }
       }),
       utils.defineTemplateBodyVisitor(context, {
+        /** @param {VElement} node */
         "VElement[name='slot']"(node) {
-          let slotName = 'default'
-
-          const slotNameAttr = utils.getAttribute(node, 'name')
+          const nameNode = node.startTag.attributes.find(
+            (node) =>
+              (!node.directive && node.key.name === 'name') ||
+              (node.directive &&
+                node.key.name.name === 'bind' &&
+                node.key.argument?.type === 'VIdentifier' &&
+                node.key.argument?.name === 'name')
+          )
 
-          if (slotNameAttr?.value) {
-            slotName = slotNameAttr.value.value
+          /** @type {string | undefined} */
+          let slotName = ''
+          if (!nameNode) {
+            // If no slot name is declared, default to 'default'
+            slotName = 'default'
+          } else if (nameNode.directive) {
+            // ignore attribute binding
+            return
+          } else {
+            slotName = nameNode.value?.value
           }
 
           if (!slotsDefined.has(slotName)) {

tests/lib/rules/require-explicit-slots.js

@@ -160,6 +160,19 @@ tester.run('require-explicit-slots', rule, {
           parser: null
         }
       }
+    },
+    // ignore attribute binding
+    {
+      filename: 'test.vue',
+      code: `
+      <template>
+        <div>
+          <slot :name="'foo'"></slot>
+        </div>
+      </template>
+      <script setup lang="ts">
+      defineSlots<{}>()
+      </script>`
     }
   ],
   invalid: [