Skip to content

"boundOnly" option for vue/v-on-function-call #1812

@iliubinskii

Description

@iliubinskii

Please describe what the rule should do:

Same as:
https://typescript-eslint.io/rules/unbound-method/

What category should the rule belong to?
[ ] Enforces code style (layout)
[+] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)

Provide 2-3 code examples that this rule should warn about:

<script lang="ts">
import { defineComponent } from "vue";

class C {
  public f(): number {
    return this.x;
  }

  protected x = 1;
}

export default defineComponent({
  name: "page-settings",
  setup() {
    return {
      c: new C()
    };
  }
});
</script>

<template>
  <q-button @click="c.f" />
</template>

Additional context

New rule should report missing brakets for <q-button @click="c.f" />

Without brackets it throws run-time error:
image

Activity

FloEdelmann

FloEdelmann commented on Mar 2, 2022

@FloEdelmann
Member
iliubinskii

iliubinskii commented on Mar 2, 2022

@iliubinskii
Author

@FloEdelmann, thx for the response.

Is it possible to add an option to v-on-function-call that will disallow brackets for @click="fn", but will require brackets for @click="cls.method()"?

The point is that currently "v-on-function-call" does not do what "unbound-method" does.
This is unbound method: "cls.method" (because it consists of two parts). It needs bracket.
This is not unbound method: "fn" (because it has only one part). It can be left without bracket.

FloEdelmann

FloEdelmann commented on Mar 3, 2022

@FloEdelmann
Member

A new option "boundOnly" (instead of "always" and "never") would be fine for me. Would you like to implement it?

If implemented, this option's docs should link to the explanation in typescript-eslint rule's documentation.

iliubinskii

iliubinskii commented on Mar 4, 2022

@iliubinskii
Author

Thx for accepting it as proposition.
I am familiar with typescript/eslint plugin development, but eslint-plugin-vue is totaly new to me - so, I'll have to wait for somebody more familiar with it.
If I have time, I will more likely try to write a wrapper rule that would allow to use any typescript/eslint rule inside SFC.

changed the title [-]Rule Proposal: Equivalent of @typescript-eslint/unbound-method[/-] [+]`"boundOnly"` option for `vue/v-on-function-call`[/+] on Mar 9, 2022
FloEdelmann

FloEdelmann commented on May 16, 2023

@FloEdelmann
Member

Note that the vue/v-on-function-call rule was deprecated in favor of the new vue/v-on-handler-style rule in #2009. Is this request solved with the new rule? If it isn't, please open a new issue to keep the discussion clear.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @FloEdelmann@iliubinskii

        Issue actions

          `"boundOnly"` option for `vue/v-on-function-call` · Issue #1812 · vuejs/eslint-plugin-vue