fix: 支付宝小程序支持作用域插槽 fixed #1253

packages/uni-mp-alipay/lib/uni.compiler.js

+const t = require('@babel/types')
+const traverse = require('@babel/traverse').default
+
 function cached (fn) {
   const cache = Object.create(null)
   return function cachedFn (str) {
@@ -82,12 +85,55 @@ module.exports = {
       type: 'view',
       attr: {
         slot: slotName
-      },
-      children: normalizeChildren(traverseExpr(returnExprNodes, state))
+      }
     }
-    if (paramExprNode && paramExprNode.type === 'Identifier') {
-      node.scoped = paramExprNode.name
+    if (paramExprNode) {
+      if (t.isIdentifier(paramExprNode)) {
+        const scoped = paramExprNode.name
+        node.attr['slot-scope'] = scoped
+      } else if (t.isObjectPattern(paramExprNode)) {
+        const paramName = '__SCOPED__'
+        node.attr['slot-scope'] = paramName
+        const start = returnExprNodes.start
+        const end = returnExprNodes.end
+        const names = []
+        paramExprNode.properties.forEach(property => {
+          const key = property.key
+          const value = property.value
+          if (t.isIdentifier(value)) {
+            if (value.name !== key.name) {
+              state.errors.add(`解构插槽 Prop 时,不支持将${key.name}重命名为${value.name},重命名后会影响性能`)
+              return
+            }
+          } else if (t.isAssignmentPattern(value)) {
+            state.errors.add(`解构插槽 Prop 时,不支持为${key.name}设置默认值`)
+            return
+          }
+          names.push(key.name)
+        })
+        traverse({
+          type: 'Program',
+          start,
+          end,
+          body: [{
+            type: 'ExpressionStatement',
+            start,
+            end,
+            expression: returnExprNodes
+          }],
+          sourceType: 'module'
+        }, {
+          Identifier (path) {
+            const node = path.node
+            const name = node.name
+            if (names.includes(name) && path.key !== 'key' && path.key !== 'property' && !(path.scope && path.scope.hasBinding(name))) {
+              path.replaceWithSourceString(`${paramName}.${name}`)
+            }
+          }
+        })
+      }
     }
+    node.children = normalizeChildren(traverseExpr(returnExprNodes, state))
     return node
   }
-}
+}

packages/uni-template-compiler/__tests__/compiler-mp-alipay.spec.js

@@ -60,6 +60,18 @@ describe('mp:compiler-mp-alipay', () => {
       '<component1 vue-id="551070e6-1" onVueInit="__l">text<view slot="right"></view></component1>'
     )
   })
+
+  it('generate scoped slot', () => {
+    assertCodegen(
+      '<component1 :text="\'text\'"><template v-slot="props"><view :class="{text:props.text}">{{props.text}}</view></template></component1>',
+      '<component1 vue-id="551070e6-1" text="text" onVueInit="__l"><view slot="default" slot-scope="props"><view class="{{((props.text)?\'text\':\'\')}}">{{props.text}}</view></view></component1>'
+    )
+    assertCodegen(
+      '<component1 :text="\'text\'"><template v-slot="{text}"><view :class="{text:text}">{{text}}</view></template></component1>',
+      '<component1 vue-id="551070e6-1" text="text" onVueInit="__l"><view slot="default" slot-scope="__SCOPED__"><view class="{{((__SCOPED__.text)?\'text\':\'\')}}">{{__SCOPED__.text}}</view></view></component1>'
+    )
+  })
+
   it('generate class binding', () => {
     assertCodegen(
       '<div :class="{ active: isActive }">1</div>',
@@ -148,4 +160,4 @@ describe('mp:compiler-mp-alipay', () => {
       '<movable-view data-event-opts="{{[[\'changeEnd\',[[\'changeEnd\',[\'$event\']]]]]}}" onChangeEnd="__e"></movable-view>'
     )
   })
-})
+})