How to remove [vue/no-use-v-if-with-v-for] warning?

You can disable selective eslint rules in your <template> by adding an HTML comment like this:

<!-- eslint-disable vue/no-use-v-if-with-v-for,vue/no-confusing-v-for-v-if -->

You may also use:

<!-- eslint-disable -->... code that breaks linting ...<!-- eslint-enable -->

You need to turn off the rule in your eslintrc config options as follows:

rules: {    // allow debugger during development    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',    "vue/no-use-v-if-with-v-for": "off"}

Reference: https://eslint.org/docs/user-guide/configuring#configuring-rules

I understand that you followed the instructions to set "allowUsingIterationVar": true which is not working. This is because you already specified "error" in the array literal syntax, which turns on the rule as per eslint config guide. As given in the reference page linked above, the first item in the array always indicates rule severity.

In my sample config above, I am using a simple string to turn off the rule as follows:

"vue/no-use-v-if-with-v-for": "off"

I understand you asked specifically on how to ignore this warning, but this is a reminder for others who might benefit more from fixing it instead of ignoring it:

The warning is there for a good reason, it warns you because this approach will decrease performance, so you better follow the advice of the linter and replace this with a computed property, which will be faster because of how the computed property caching

https://vuejs.org/v2/guide/computed.html#Computed-Caching-vs-Methods