label-has-for fails for bound id/label

When using a dynamic for / id attribute on label / input elements the rule label-has-for fails.

error: Form label must have associated control (vue-a11y/label-has-for)

<template>
  <label :for="_uid">
    <input :id="_uid">
  </label>
</template>

Expected behaviour: The rule passes.

[venikman]

I got it work. The problem that looks like that rule was taken from react rules. You can see it in documentation for rule. Name of rule for react. jsx-a11y/label-has-for". So what I had to do it to add options for it.

"vue-a11y/label-has-for": [ 2, {
            "components": [ "label" ],
            "required": {
                "every": [ "nesting", "id" ]
            },
            "allowChildren": false
        }]

I changed jsx to vue and Label to label I will probably can open a PR to fix it.

[ZebulanStanphill]

It’s worth noting that eslint-plugin-jsx-a11y’s label-has-for has recently been deprecated and replaced by label-has-associated-control. This plugin should probably follow suit.