From bd96693e1c9baff762ca823d344605e4163680a3 Mon Sep 17 00:00:00 2001
From: fxy060608 <fxy060608@gmail.com>
Date: Fri, 19 Nov 2021 14:22:19 +0800
Subject: [PATCH] fix(mp): v-if + v-for

---
 .../uni-mp-compiler/__tests__/vFor.spec.ts    |  4 ++--
 .../uni-mp-compiler/src/template/codegen.ts   | 23 ++++++++++++++++---
 2 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/packages/uni-mp-compiler/__tests__/vFor.spec.ts b/packages/uni-mp-compiler/__tests__/vFor.spec.ts
index f71dc2fa6..02fa19437 100644
--- a/packages/uni-mp-compiler/__tests__/vFor.spec.ts
+++ b/packages/uni-mp-compiler/__tests__/vFor.spec.ts
@@ -204,7 +204,7 @@ describe(`compiler: v-for`, () => {
     test(`v-if + v-for`, () => {
       assert(
         `<view v-if="ok" v-for="i in list"/>`,
-        `<view wx:if="{{a}}" wx:for="{{b}}" wx:for-item="i"/>`,
+        `<block wx:if="{{a}}"><view wx:for="{{b}}" wx:for-item="i"/></block>`,
         `(_ctx, _cache) => {
   return _e({ a: _ctx.ok }, _ctx.ok ? { b: _f(_ctx.list, (i, k0, i0) => { return {}; }) } : {})
 }`
@@ -214,7 +214,7 @@ describe(`compiler: v-for`, () => {
     test(`v-if + v-for on <template>`, () => {
       assert(
         `<template v-if="ok" v-for="i in list"/>`,
-        `<block wx:if="{{a}}" wx:for="{{b}}" wx:for-item="i"/>`,
+        `<block wx:if="{{a}}"><block wx:for="{{b}}" wx:for-item="i"/></block>`,
         `(_ctx, _cache) => {
   return _e({ a: _ctx.ok }, _ctx.ok ? { b: _f(_ctx.list, (i, k0, i0) => { return {}; }) } : {})
 }`
diff --git a/packages/uni-mp-compiler/src/template/codegen.ts b/packages/uni-mp-compiler/src/template/codegen.ts
index 70840599a..5dd9f888e 100644
--- a/packages/uni-mp-compiler/src/template/codegen.ts
+++ b/packages/uni-mp-compiler/src/template/codegen.ts
@@ -270,8 +270,11 @@ function genElement(node: ElementNode, context: TemplateCodegenContext) {
     tag = hyphenate(tag)
   }
   const { push } = context
-  push(`<${tag}`)
-  if (isIfElementNode(node)) {
+
+  const hasVIf = isIfElementNode(node)
+  const hasVFor = isForElementNode(node)
+  const hasVIfAndVFor = hasVIf && hasVFor
+  function genVIfCode(node: IfElementNode) {
     const { name, condition } = node.vIf
     if (name === 'if') {
       genVIf(condition!, context)
@@ -281,7 +284,18 @@ function genElement(node: ElementNode, context: TemplateCodegenContext) {
       genVElse(context)
     }
   }
-  if (isForElementNode(node)) {
+  // 小程序中 wx:else wx:elif 不支持与 wx:for 同时使用
+  // 故 if 需要补充一层 block
+  if (hasVIfAndVFor) {
+    push(`<block`)
+    genVIfCode(node)
+    push(`>`)
+  }
+  push(`<${tag}`)
+  if (!hasVIfAndVFor && hasVIf) {
+    genVIfCode(node)
+  }
+  if (hasVFor) {
     genVFor(node, context)
   }
   if (props.length) {
@@ -297,6 +311,9 @@ function genElement(node: ElementNode, context: TemplateCodegenContext) {
     })
     push(`</${tag}>`)
   }
+  if (hasVIfAndVFor) {
+    push(`</block>`)
+  }
 }
 
 export function genElementProps(
-- 
GitLab