diff --git a/docs/rules/index.md b/docs/rules/index.md
index 9624111c6..2a0ad7bfa 100644
--- a/docs/rules/index.md
+++ b/docs/rules/index.md
@@ -162,7 +162,7 @@ Rules in this category are enabled for all presets provided by eslint-plugin-vue
 | [vue/singleline-html-element-content-newline](./singleline-html-element-content-newline.md) | require a line break before and after the contents of a singleline element | :wrench: | :three::two::lipstick: |
 | [vue/v-bind-style](./v-bind-style.md) | enforce `v-bind` directive style | :wrench: | :three::two::hammer: |
 | [vue/v-on-event-hyphenation](./v-on-event-hyphenation.md) | enforce v-on event naming style on custom components in template | :wrench: | :three::hammer: |
-| [vue/v-on-style](./v-on-style.md) | enforce `v-on` directive style | :wrench: | :three::two::hammer: |
+| [vue/v-on-style](./v-on-style.md) | enforce `v-on` directive style | :wrench::bulb: | :three::two::hammer: |
 | [vue/v-slot-style](./v-slot-style.md) | enforce `v-slot` directive style | :wrench: | :three::two::hammer: |
 
 </rules-table>
diff --git a/docs/rules/v-on-style.md b/docs/rules/v-on-style.md
index 56bcb2221..75736ca94 100644
--- a/docs/rules/v-on-style.md
+++ b/docs/rules/v-on-style.md
@@ -12,6 +12,7 @@ since: v3.0.0
 
 - :gear: This rule is included in all of `"plugin:vue/vue3-strongly-recommended"`, `*.configs["flat/strongly-recommended"]`, `"plugin:vue/strongly-recommended"`, `*.configs["flat/vue2-strongly-recommended"]`, `"plugin:vue/vue3-recommended"`, `*.configs["flat/recommended"]`, `"plugin:vue/recommended"` and `*.configs["flat/vue2-recommended"]`.
 - :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 
 ## :book: Rule Details
 
diff --git a/lib/rules/v-on-handler-style.js b/lib/rules/v-on-handler-style.js
index 10ff9b6b1..0d6671f15 100644
--- a/lib/rules/v-on-handler-style.js
+++ b/lib/rules/v-on-handler-style.js
@@ -112,6 +112,7 @@ module.exports = {
       url: 'https://eslint.vuejs.org/rules/v-on-handler-style.html'
     },
     fixable: 'code',
+    hasSuggestions: true,
     schema: [
       {
         oneOf: [
@@ -157,7 +158,11 @@ module.exports = {
       preferInlineFunctionOverMethod:
         'Prefer inline function over method handler in v-on.',
       preferInlineFunctionOverInline:
-        'Prefer inline function over inline handler in v-on.'
+        'Prefer inline function over inline handler in v-on.',
+      removeParenthesesOverInline:
+        'Remove the parentheses from the inline handler in v-on.',
+      removeParenthesesOverInlineFunction:
+        'Remove the parentheses from the inline function in v-on.'
     }
   },
   /** @param {RuleContext} context */
@@ -300,6 +305,36 @@ module.exports = {
         return false
       }
 
+      // disable the auto-fixed when the node does't have params
+      if (
+        !hasComment /* The statement contains comment and cannot be fixed. */ &&
+        idCallExpr /* The statement is not a simple identifier call and cannot be fixed. */ &&
+        idCallExpr.arguments.length === 0
+      ) {
+        const paramCount = methodParamCountMap.get(idCallExpr.callee.name)
+        if (
+          idCallExpr &&
+          (idCallExpr.arguments.length === 0 || paramCount === 0)
+        ) {
+          context.report({
+            node,
+            messageId: 'preferMethodOverInline',
+            suggest: [
+              {
+                messageId: 'removeParenthesesOverInline',
+                fix(fixer) {
+                  return fixer.replaceTextRange(
+                    rangeWithoutQuotes,
+                    context.getSourceCode().getText(idCallExpr.callee)
+                  )
+                }
+              }
+            ]
+          })
+          return true
+        }
+      }
+
       context.report({
         node,
         messageId: idCallExpr
@@ -324,6 +359,7 @@ module.exports = {
           )
         }
       })
+
       return true
     }
     /**
@@ -356,6 +392,30 @@ module.exports = {
         return false
       }
 
+      // disable the auto-fixed when the node does't have params
+      if (
+        !hasComment /* The statement contains comment and cannot be fixed. */ &&
+        idCallExpr /* The statement is not a simple identifier call and cannot be fixed. */ &&
+        (node.params.length === 0 || !isSameParamsAndArgs(idCallExpr))
+      ) {
+        context.report({
+          node,
+          messageId: 'preferMethodOverInlineFunction',
+          suggest: [
+            {
+              messageId: 'removeParenthesesOverInlineFunction',
+              fix(fixer) {
+                return fixer.replaceTextRange(
+                  rangeWithoutQuotes,
+                  context.getSourceCode().getText(idCallExpr.callee)
+                )
+              }
+            }
+          ]
+        })
+        return true
+      }
+
       context.report({
         node,
         messageId: idCallExpr
@@ -368,10 +428,6 @@ module.exports = {
           ) {
             return null
           }
-          if (!isSameParamsAndArgs(idCallExpr)) {
-            // It is not a call with the arguments given as is.
-            return null
-          }
           const paramCount = methodParamCountMap.get(idCallExpr.callee.name)
           if (
             paramCount != null &&
diff --git a/tests/lib/rules/v-on-handler-style.js b/tests/lib/rules/v-on-handler-style.js
index a169402f7..4915bf507 100644
--- a/tests/lib/rules/v-on-handler-style.js
+++ b/tests/lib/rules/v-on-handler-style.js
@@ -81,22 +81,38 @@ tester.run('v-on-handler-style', rule, {
         <button @click="foo()" />
         <button @click="() => foo()" />
       </template>`,
-      output: `<template>
-        <button @click="foo" />
-        <button @click="foo" />
-        <button @click="foo" />
-      </template>`,
+      output: null,
       options: [['method', 'inline-function']],
       errors: [
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 3,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `<template>
+        <button @click="foo" />
+        <button @click="foo" />
+        <button @click="() => foo()" />
+      </template>`
+            }
+          ]
         },
         {
           message: 'Prefer method handler over inline function in v-on.',
           line: 4,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInlineFunction',
+              output: `<template>
+        <button @click="foo" />
+        <button @click="foo()" />
+        <button @click="foo" />
+      </template>`
+            }
+          ]
         }
       ]
     },
@@ -107,21 +123,37 @@ tester.run('v-on-handler-style', rule, {
         <button @click="foo()" />
         <button @click="() => foo()" />
       </template>`,
-      output: `<template>
-        <button @click="foo" />
-        <button @click="foo" />
-        <button @click="foo" />
-      </template>`,
+      output: null,
       errors: [
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 3,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `<template>
+        <button @click="foo" />
+        <button @click="foo" />
+        <button @click="() => foo()" />
+      </template>`
+            }
+          ]
         },
         {
           message: 'Prefer method handler over inline function in v-on.',
           line: 4,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInlineFunction',
+              output: `<template>
+        <button @click="foo" />
+        <button @click="foo()" />
+        <button @click="foo" />
+      </template>`
+            }
+          ]
         }
       ]
     },
@@ -181,13 +213,19 @@ tester.run('v-on-handler-style', rule, {
     {
       filename: 'test.vue',
       code: '<template><div @click="foo( )" /></template>',
-      output: `<template><div @click="foo" /></template>`,
+      output: null,
       options: [['method', 'inline-function']],
       errors: [
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 1,
-          column: 24
+          column: 24,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `<template><div @click="foo" /></template>`
+            }
+          ]
         }
       ]
     },
@@ -266,34 +304,76 @@ tester.run('v-on-handler-style', rule, {
         <button @click="{ fn(); }" />
         <button @click="{(fn());;;}" />
       </template>`,
-      output: `
-      <template>
-        <button @click="fn" />
-        <button @click="fn" />
-        <button @click="fn" />
-        <button @click="fn" />
-      </template>`,
+      output: null,
       options: [['method', 'inline-function']],
       errors: [
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 3,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
+      <template>
+        <button @click="fn" />
+        <button @click="fn();;" />
+        <button @click="{ fn(); }" />
+        <button @click="{(fn());;;}" />
+      </template>`
+            }
+          ]
         },
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 4,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
+      <template>
+        <button @click="fn();" />
+        <button @click="fn" />
+        <button @click="{ fn(); }" />
+        <button @click="{(fn());;;}" />
+      </template>`
+            }
+          ]
         },
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 5,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
+      <template>
+        <button @click="fn();" />
+        <button @click="fn();;" />
+        <button @click="fn" />
+        <button @click="{(fn());;;}" />
+      </template>`
+            }
+          ]
         },
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 6,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
+      <template>
+        <button @click="fn();" />
+        <button @click="fn();;" />
+        <button @click="{ fn(); }" />
+        <button @click="fn" />
+      </template>`
+            }
+          ]
         }
       ]
     },
@@ -304,22 +384,38 @@ tester.run('v-on-handler-style', rule, {
         <div @click=" beforeSpace()" />
         <div @click='afterSpace() ' />
       </template>`,
-      output: `
-      <template>
-        <div @click="beforeSpace" />
-        <div @click='afterSpace' />
-      </template>`,
+      output: null,
       options: [['method', 'inline-function']],
       errors: [
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 3,
-          column: 23
+          column: 23,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
+      <template>
+        <div @click="beforeSpace" />
+        <div @click='afterSpace() ' />
+      </template>`
+            }
+          ]
         },
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 4,
-          column: 22
+          column: 22,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
+      <template>
+        <div @click=" beforeSpace()" />
+        <div @click='afterSpace' />
+      </template>`
+            }
+          ]
         }
       ]
     },
@@ -329,16 +425,22 @@ tester.run('v-on-handler-style', rule, {
       <template>
         <button @click=" &#x66;oo ( ) " />
       </template>`,
-      output: `
-      <template>
-        <button @click="&#x66;oo" />
-      </template>`,
+      output: null,
       options: [['method', 'inline-function']],
       errors: [
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 3,
-          column: 26
+          column: 26,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
+      <template>
+        <button @click="&#x66;oo" />
+      </template>`
+            }
+          ]
         }
       ]
     },
@@ -353,7 +455,17 @@ tester.run('v-on-handler-style', rule, {
         }
       }
       </script>`,
-      output: `
+      output: null,
+      options: [['method', 'inline-function']],
+      errors: [
+        {
+          message: 'Prefer method handler over inline handler in v-on.',
+          line: 2,
+          column: 33,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
       <template><button @click="foo" /></template>
       <script>
       export default {
@@ -361,13 +473,9 @@ tester.run('v-on-handler-style', rule, {
           foo() {}
         }
       }
-      </script>`,
-      options: [['method', 'inline-function']],
-      errors: [
-        {
-          message: 'Prefer method handler over inline handler in v-on.',
-          line: 2,
-          column: 33
+      </script>`
+            }
+          ]
         }
       ]
     },
@@ -382,7 +490,17 @@ tester.run('v-on-handler-style', rule, {
         }
       }
       </script>`,
-      output: `
+      output: null,
+      options: [['method', 'inline-function']],
+      errors: [
+        {
+          message: 'Prefer method handler over inline handler in v-on.',
+          line: 2,
+          column: 33,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `
       <template><button @click="foo" /></template>
       <script>
       export default {
@@ -390,13 +508,9 @@ tester.run('v-on-handler-style', rule, {
           foo: () => {}
         }
       }
-      </script>`,
-      options: [['method', 'inline-function']],
-      errors: [
-        {
-          message: 'Prefer method handler over inline handler in v-on.',
-          line: 2,
-          column: 33
+      </script>`
+            }
+          ]
         }
       ]
     },
@@ -545,17 +659,23 @@ tester.run('v-on-handler-style', rule, {
           <button @click="e()" />
         </template>
       </template>`,
-      output: `<template>
-        <template v-for="e in list">
-          <button @click="e" />
-        </template>
-      </template>`,
+      output: null,
       options: [['method', 'inline-function']],
       errors: [
         {
           message: 'Prefer method handler over inline handler in v-on.',
           line: 3,
-          column: 27
+          column: 27,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInline',
+              output: `<template>
+        <template v-for="e in list">
+          <button @click="e" />
+        </template>
+      </template>`
+            }
+          ]
         }
       ]
     },
@@ -716,16 +836,26 @@ tester.run('v-on-handler-style', rule, {
         <button @click="() => { foo() }" />
       </template>`,
       output: `<template>
+        <button @click="() => foo()" />
         <button @click="foo" />
-        <button @click="foo" />
-        <button @click="foo" />
+        <button @click="() => { foo() }" />
       </template>`,
       options: [['method', 'inline']],
       errors: [
         {
           message: 'Prefer method handler over inline function in v-on.',
           line: 2,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInlineFunction',
+              output: `<template>
+        <button @click="foo" />
+        <button @click="(a, b) => foo(a, b)" />
+        <button @click="() => { foo() }" />
+      </template>`
+            }
+          ]
         },
         {
           message: 'Prefer method handler over inline function in v-on.',
@@ -735,7 +865,17 @@ tester.run('v-on-handler-style', rule, {
         {
           message: 'Prefer method handler over inline function in v-on.',
           line: 4,
-          column: 25
+          column: 25,
+          suggestions: [
+            {
+              messageId: 'removeParenthesesOverInlineFunction',
+              output: `<template>
+        <button @click="() => foo()" />
+        <button @click="(a, b) => foo(a, b)" />
+        <button @click="foo" />
+      </template>`
+            }
+          ]
         }
       ]
     },
@@ -1008,7 +1148,7 @@ tester.run('v-on-handler-style', rule, {
       </template>`,
       output: `<template>
         <template v-for="e in list">
-          <button @click="e" />
+          <button @click="() => e()" />
           <button @click="e" />
           <button @click="e" />
         </template>