Pacify eslint re using v-if with v-for

Mini rant about this: eslint flags using v-if on the same element as v-for as an error, but the explanation page (https://eslint.vuejs.org/rules/no-use-v-if-with-v-for) doesn't explain why it's a bad idea. It does however link to the Vue style guide rule about it (https://vuejs.org/style-guide/rules-essential.html#avoid-v-if-with-v-for) which also doesn't explain why it's a bad idea, but does point out that v-if has higher priority than v-for, which means that if your v-if depends on a variable defined in the v-for it won't work.

However, that's not what was happening here: the v-if was hiding the subelements if there was no search result at all, and the v-for was iterating over a (transformed) version of the results. Sure, that may be bad style as it's confusing, but it's obviously not an error as it's working fine and the precedence issue is unambiguously documented.

I'm not sure what the point of this rant is. Maybe I should just patch eslint. But it would be helpful if the linter was able to explain the consequences of an issue rather than blindly following style rules.

frontend/src/components/SearchResults.vue

@@ -10,7 +10,7 @@ Copyright 2023 Telemarq Ltd
 			<div v-for="device in activeDevices" class="header">
 				<span class="deviceName">{{ device }}</span>
 			</div>
-			<div v-if="searchResult" v-for="eventRow in eventsRowGenerator()" class="row">
+			<div v-for="eventRow in eventsRowGenerator()" class="row">
 				<template v-for="event in eventRow">
 					<div v-if="event !== null" class="event" :class="event.__typename">
 						<SearchResultMessageEvent