# wxml/no-wx-for-with-wx-else

# Backgroud

WARNING

You can't use wx:for with wx:else at same tag, it will cause wechat miniprogram compile error like follow 👇

error

Releative official community discussion

# Motivation

Force developer using wx:for without wx:else, that's wrong wxml grammer, so we need avoid the compile error.

<!-- ✓ GOOD -->
<view wx:for="{{list}}"> {{item.name}}</view>
<view wx:if="{{showList}}" wx:for="{{list}}"> {{item.name}}</view>
<view wx:elif="{{showOtherList}}" wx:for="{{otherList}}"> {{item.name}}</view>
<!-- use <block /> to wrap loop list is official recommended -->
<view wx:if="{{showList}}" wx:for="{{list}}"> {{item.name}}</view>
<block wx:else>
  <view wx:for="{{otherList}}"> {{item.name}}</view>
</block>

<!-- ✗ BAD -->
<view wx:if="{{showList}}" wx:for="{{list}}"> {{item.name}}</view>
<view wx:else wx:for="{{lastList}}"> {{item.name}}</view>

Now loading...

💡 tips

You can edit code via online editor, it's online REPL, try to fix eslint problem !

# Config

No special options, normal config is ok

{ "wxml/no-wx-for-with-wx-else": "error" }

# Version

This rule was introduced in eslint-plugin-wxml v0.5.0

# Implementation

← wxml/no-vue-directive wxml/no-wx-for-with-wx-if →