Просмотр исходного кода

wip: update directive scope variable mapping

Evan You 5 лет назад
Родитель
Сommit
69d5c6887e

+ 10 - 21
packages/compiler-core/src/transforms/transformElement.ts

@@ -257,11 +257,7 @@ export function resolveComponentType(
   // this is skipped in browser build since browser builds do not perform
   // binding analysis.
   if (!__BROWSER__) {
-    const fromSetup = resolveSetupReference(
-      tag,
-      capitalize(camelize(tag)),
-      context
-    )
+    const fromSetup = resolveSetupReference(tag, context)
     if (fromSetup) {
       return fromSetup
     }
@@ -273,22 +269,23 @@ export function resolveComponentType(
   return toValidAssetId(tag, `component`)
 }
 
-function resolveSetupReference(
-  name: string,
-  interopName: string,
-  context: TransformContext
-) {
+function resolveSetupReference(name: string, context: TransformContext) {
   const bindings = context.bindingMetadata
   if (!bindings) {
     return
   }
 
+  const camelName = camelize(name)
+  const PascalName = capitalize(camelName)
   const checkType = (type: BindingTypes) => {
     if (bindings[name] === type) {
       return name
     }
-    if (bindings[interopName] === type) {
-      return interopName
+    if (bindings[camelName] === type) {
+      return camelName
+    }
+    if (bindings[PascalName] === type) {
+      return PascalName
     }
   }
 
@@ -615,15 +612,7 @@ function buildDirectiveArgs(
   } else {
     // user directive.
     // see if we have directives exposed via <script setup>
-    const fromSetup =
-      !__BROWSER__ &&
-      resolveSetupReference(
-        dir.name,
-        // v-my-dir -> vMyDir
-        'v' + capitalize(camelize(dir.name)),
-        context
-      )
-
+    const fromSetup = !__BROWSER__ && resolveSetupReference(dir.name, context)
     if (fromSetup) {
       dirArgs.push(fromSetup)
     } else {

+ 2 - 2
packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap

@@ -224,7 +224,7 @@ exports[`SFC compile <script setup> inlineTemplate mode referencing scope compon
 
 import ChildComp from './Child.vue'
         import SomeOtherComp from './Other.vue'
-        import vMyDir from './my-dir'
+        import myDir from './my-dir'
         
 export default {
   expose: [],
@@ -234,7 +234,7 @@ export default {
 return (_ctx, _cache) => {
   return (_openBlock(), _createBlock(_Fragment, null, [
     _withDirectives(_createVNode(\\"div\\", null, null, 512 /* NEED_PATCH */), [
-      [_unref(vMyDir)]
+      [_unref(myDir)]
     ]),
     _createVNode(ChildComp),
     _createVNode(SomeOtherComp)

+ 2 - 2
packages/compiler-sfc/__tests__/compileScript.spec.ts

@@ -192,7 +192,7 @@ const myEmit = defineEmit(['foo', 'bar'])
         <script setup>
         import ChildComp from './Child.vue'
         import SomeOtherComp from './Other.vue'
-        import vMyDir from './my-dir'
+        import myDir from './my-dir'
         </script>
         <template>
           <div v-my-dir></div>
@@ -202,7 +202,7 @@ const myEmit = defineEmit(['foo', 'bar'])
         `,
         { inlineTemplate: true }
       )
-      expect(content).toMatch('[_unref(vMyDir)]')
+      expect(content).toMatch('[_unref(myDir)]')
       expect(content).toMatch('_createVNode(ChildComp)')
       // kebab-case component support
       expect(content).toMatch('_createVNode(SomeOtherComp)')