fix(mp): page with props

packages/uni-mp-compiler/__tests__/component.spec.ts

@@ -10,7 +10,7 @@ describe('compiler: transform component', () => {
   test('component + component', () => {
     assert(
       `<custom><custom1/></custom>`,
-      `<custom u-s="{{['d']}}" u-i="2a9ec0b0-0" bind:__l="__l"><custom1 u-s="{{['d']}}" slot="d" u-i="2a9ec0b0-1,2a9ec0b0-0" bind:__l="__l"/></custom>`,
+      `<custom u-s="{{['d']}}" u-i="2a9ec0b0-0" bind:__l="__l"><custom1 u-i="2a9ec0b0-1,2a9ec0b0-0" bind:__l="__l" slot="d"/></custom>`,
       `(_ctx, _cache) => {
   return {}
 }`,
@@ -22,7 +22,7 @@ describe('compiler: transform component', () => {
   test('component + component + component', () => {
     assert(
       `<custom><custom1><custom2/><custom2/></custom1></custom>`,
-      `<custom u-s="{{['d']}}" u-i="2a9ec0b0-0" bind:__l="__l"><custom1 u-s="{{['d']}}" slot="d" u-i="2a9ec0b0-1,2a9ec0b0-0" bind:__l="__l"><view slot="d"><custom2 u-i="2a9ec0b0-2,2a9ec0b0-1" bind:__l="__l"/><custom2 u-i="2a9ec0b0-3,2a9ec0b0-1" bind:__l="__l"/></view></custom1></custom>`,
+      `<custom u-s="{{['d']}}" u-i="2a9ec0b0-0" bind:__l="__l"><custom1 u-s="{{['d']}}" u-i="2a9ec0b0-1,2a9ec0b0-0" bind:__l="__l" slot="d"><view slot="d"><custom2 u-i="2a9ec0b0-2,2a9ec0b0-1" bind:__l="__l"/><custom2 u-i="2a9ec0b0-3,2a9ec0b0-1" bind:__l="__l"/></view></custom1></custom>`,
       `(_ctx, _cache) => {
   return {}
 }`,
@@ -68,7 +68,7 @@ describe('compiler: transform component', () => {
   test('component with v-for + component', () => {
     assert(
       `<custom v-for="item in items"><custom1/></custom>`,
-      `<custom wx:for="{{a}}" wx:for-item="item" u-s="{{['d']}}" u-i="{{item.b}}" bind:__l="__l"><custom1 u-s="{{['d']}}" slot="d" u-i="{{item.a}}" bind:__l="__l"/></custom>`,
+      `<custom wx:for="{{a}}" wx:for-item="item" u-s="{{['d']}}" u-i="{{item.b}}" bind:__l="__l"><custom1 u-i="{{item.a}}" bind:__l="__l" slot="d"/></custom>`,
       `(_ctx, _cache) => {
   return { a: _f(_ctx.items, (item, k0, i0) => { return { a: '2a9ec0b0-1' + '-' + i0 + ',' + ('2a9ec0b0-0' + '-' + i0), b: '2a9ec0b0-0' + '-' + i0 }; }) }
 }`,

packages/uni-mp-compiler/__tests__/test.ts

@@ -60,7 +60,7 @@ addMiniProgramPageJson(filename, {
   },
 })
 assert(
-  `<custom><div>test</div></custom>`,
+  `<van-button><template #default><view/></template></van-button>`,
   `<van-button u-i="dc555fe4-0"/>`,
   `(_ctx, _cache) => {
 return {}

packages/uni-mp-compiler/src/transforms/vSlot.ts

@@ -15,7 +15,6 @@ import {
   createCompoundExpression,
   createSimpleExpression,
   DirectiveNode,
-  ElementNode,
   ElementTypes,
   ErrorCodes,
   ExpressionNode,
@@ -48,7 +47,6 @@ import {
 } from './utils'
 import { createVForArrowFunctionExpression } from './vFor'
 import { DYNAMIC_SLOT } from '../runtimeHelpers'
-import { transformTag } from './transformTag'
 
 export const transformSlot: NodeTransform = (node, context) => {
   if (!isUserComponent(node, context as any)) {
@@ -126,26 +124,15 @@ export const transformSlot: NodeTransform = (node, context) => {
   } else {
     if (implicitDefaultChildren.length) {
       // <custom>test</custom> => <custom><template #default>test</template></custom>
-      const vSlotDir = createDirectiveNode('slot', 'default')
-      const child = implicitDefaultChildren[0] as ElementNode
-      // 此时处于父节点的 transform，child 还未被转换标签，故需要先转换，否则 isUserComponent 会判断失败，比如 div
-      transformTag(child, context)
-      const isSingleComponent =
-        implicitDefaultChildren.length === 1 &&
-        isUserComponent(child, context) &&
-        !findDir(child, 'for')
-      if (isSingleComponent) {
-        child.props.unshift(vSlotDir)
-      } else {
-        const templateNode = createTemplateNode(
-          vSlotDir,
+      implicitDefaultChildren.forEach((child) => {
+        node.children.splice(node.children.indexOf(child), 1)
+      })
+      node.children.unshift(
+        createTemplateNode(
+          createDirectiveNode('slot', 'default'),
           implicitDefaultChildren
         )
-        implicitDefaultChildren.forEach((child) => {
-          node.children.splice(node.children.indexOf(child), 1)
-        })
-        node.children.unshift(templateNode)
-      }
+      )
     }
   }
   // 不支持 $slots, 则自动补充 props

packages/uni-mp-core/src/runtime/componentProps.ts

 import { ComponentPropsOptions } from '@vue/runtime-core'
-import { extend, isArray, isPlainObject } from '@vue/shared'
+import { extend, isArray, isFunction, isPlainObject } from '@vue/shared'
 import type { MPComponentOptions, MPComponentInstance } from './component'
 // @ts-ignore
 import { findComponentPropsData } from 'vue'
@@ -64,6 +64,34 @@ export function initProps(mpComponentOptions: MPComponentOptions) {
   }
   extend(mpComponentOptions.properties, initDefaultProps())
 }
+
+const PROP_TYPES = [String, Number, Boolean, Object, Array, null]
+
+function parsePropType(type: unknown, defaultValue: unknown) {
+  // [String]=>String
+  if (isArray(type) && type.length === 1) {
+    return type[0]
+  }
+  if (__PLATFORM__ === 'mp-baidu') {
+    if (
+      // [String,Boolean]=>Boolean
+      defaultValue === false &&
+      isArray(type) &&
+      type.length === 2 &&
+      type.indexOf(String) !== -1 &&
+      type.indexOf(Boolean) !== -1
+    ) {
+      return Boolean
+    }
+  }
+  return type
+}
+
+function normalizePropType(type: unknown, defaultValue: unknown) {
+  const res = parsePropType(type, defaultValue)
+  return PROP_TYPES.indexOf(res) !== -1 ? res : null
+}
+
 /**
  * 初始化页面 props，方便接收页面参数，类型均为String，默认值均为''
  * @param param
@@ -82,9 +110,24 @@ export function initPageProps(
     })
   } else if (isPlainObject(rawProps)) {
     Object.keys(rawProps).forEach((key) => {
-      properties![key] = {
-        type: String,
-        value: '',
+      const opts = rawProps[key]
+      if (isPlainObject(opts)) {
+        // title:{type:String,default:''}
+        let value = (opts as any).default
+        if (isFunction(value)) {
+          value = value()
+        }
+        const type = (opts as any).type as any
+        ;(opts as any).type = normalizePropType(type, value)
+        properties![key] = {
+          type: (opts as any).type,
+          value,
+        }
+      } else {
+        // content:String
+        properties![key] = {
+          type: normalizePropType(opts, null),
+        }
       }
     })
   }

packages/uni-mp-weixin/dist/uni.mp.esm.js

@@ -461,6 +461,18 @@ function initProps(mpComponentOptions) {
     }
     extend(mpComponentOptions.properties, initDefaultProps());
 }
+const PROP_TYPES = [String, Number, Boolean, Object, Array, null];
+function parsePropType(type, defaultValue) {
+    // [String]=>String
+    if (isArray(type) && type.length === 1) {
+        return type[0];
+    }
+    return type;
+}
+function normalizePropType(type, defaultValue) {
+    const res = parsePropType(type);
+    return PROP_TYPES.indexOf(res) !== -1 ? res : null;
+}
 /**
  * 初始化页面 props，方便接收页面参数，类型均为String，默认值均为''
  * @param param
@@ -477,10 +489,26 @@ function initPageProps({ properties }, rawProps) {
     }
     else if (isPlainObject(rawProps)) {
         Object.keys(rawProps).forEach((key) => {
-            properties[key] = {
-                type: String,
-                value: '',
-            };
+            const opts = rawProps[key];
+            if (isPlainObject(opts)) {
+                // title:{type:String,default:''}
+                let value = opts.default;
+                if (isFunction(value)) {
+                    value = value();
+                }
+                const type = opts.type;
+                opts.type = normalizePropType(type);
+                properties[key] = {
+                    type: opts.type,
+                    value,
+                };
+            }
+            else {
+                // content:String
+                properties[key] = {
+                    type: normalizePropType(opts),
+                };
+            }
         });
     }
 }