# wxml/no-vue-directive

# Backgroud

Directive

wxml directives collection

wx:for, wx:for-item, wx:for-index, wx:key

Wechat Document Reference (opens new window)

vue directives collection

v-text,v-html,v-show,v-if,v-else,v-else-if,v-for,v-on,v-bind,v-model,v-slot,v-pre,v-cloak,v-once,v-memo,v-is

Vue Document Reference (opens new window)

# Motivation

This is a funny rule, beacauce many miniprogram developers has vuejs development experience background, so developer will write v-xx directive in wxml code, that's muscle memory, this rule to avoid it.

<!-- ✓ GOOD --> <view wx:if="{{show}}"> {{title}}</view> <!-- ✗ BAD --> <view v-if="{{show}}"> {{title}}</view> <view v-else-if="{{hide}}"> {{title}}</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-vue-directive": "error" }

# Version

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

# Implementation