feat(no-duplicate-attr-inheritance): ignore multi root

[waynzh]

resolve #2596.

• since this will result in fewer errors, should we still consider adding an option to control this?
• multi root could also be a group of v-if / v-else / v-else nodes. Should we consider treating it as a "single" root?

[FloEdelmann]

• since this will result in fewer errors, should we still consider adding an option to control this?

I think it would make sense to add a new checkMultiRootNodes option (false by default).

• multi root could also be a group of v-if / v-else / v-else nodes. Should we consider treating it as a "single" root?

How does Vue itself behave here?

[waynzh]

add a new checkMultiRootNodes option (false by default).

When checkMultiRootNodes is set to true, this rule will ignore the multi root nodes error. Perhaps we could consider renaming it to something like ignoreMultiRootNodes?

How does Vue itself behave here?

Vue treats a group of v-if / v-else-if/v-else as a single node. I've added an isConditionalGroup function to do that.

[FloEdelmann]

When checkMultiRootNodes is set to true, this rule will ignore the multi root nodes error. Perhaps we could consider renaming it to something like ignoreMultiRootNodes?

Sorry, my suggestion was not clear enough. I'd say the rule should stop reporting errors for components with multiple root nodes by default. But the old behavior should still be available (for users who want to explicitly define the behavior for multi-root components) via an option. Is checkMultiRootNodes a good name for that? Do you have a better suggestion?

[waynzh]

the rule should stop reporting errors for components with multiple root nodes by default

Then the name and setting the default to false make sense to me. I've updated the test cases and docs.

[FloEdelmann]

I think this is much more readable (and we don't need to care about arrays with less than 2 entries anyway):

Suggested change

	let hasIf = false
	let hasElse = false
	for (const element of elements) {
	if (utils.hasDirective(element, 'if')) {
	if (hasIf || hasElse) {
	return false
	}
	hasIf = true
	} else if (utils.hasDirective(element, 'else-if')) {
	if (!hasIf || hasElse) {
	return false
	}
	} else if (utils.hasDirective(element, 'else')) {
	if (!hasIf || hasElse) {
	return false
	}
	hasElse = true
	} else {
	return false
	}
	}
	return hasIf && (elements.length === 1 || hasElse)
	if (elements.length < 2) {
	return false
	}
	const firstElement = element[0]
	const lastElement = elements[elements.length - 1]
	const inBetweenElements = elements.slice(1, -1)
	return (
	utils.hasDirective(firstElement, 'if') &&
	(utils.hasDirective(lastElement, 'else-if') ||
	utils.hasDirective(lastElement, 'else')) &&
	inBetweenElements.every((element) => utils.hasDirective(element, 'else-if'))
	)

[FloEdelmann]

This heading should be below the options.

[FloEdelmann]

Can you please add an explanation why the default is false (and that is fine), and why someone might still want to enable the option?