theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wip: update directive scope variable mapping

Browse Source
This commit is contained in:
Evan You 2020-11-24 19:04:03 -05:00
parent bdc66c7ea4
commit 69d5c6887e
3 changed files with 14 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/compiler-core/src/transforms/transformElement.ts
View File

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

4
packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
View File

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

4
packages/compiler-sfc/__tests__/compileScript.spec.ts
View File

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