如何在基于函数的组件中使用this.executeAction("someAction")？

import React, { useContext, useCallback } from "react";
import { MyContext } from "./MyContext";

const MyComponent = () => {
  const { executeAction } = useContext(MyContext);

  const handleAction = useCallback(() => {
    executeAction("someAction");
  }, [executeAction]);

  return (
    <button onClick={handleAction}>Execute Action</button>
  );
};

export default MyComponent;

<template>
  <button @click="handleAction">Execute Action</button>
</template>

<script>
import { inject } from "vue";

export default {
  setup() {
    const executeAction = inject("executeAction");

    const handleAction = () => {
      executeAction("someAction");
    };

    return {
      handleAction
    };
  }
};
</script>

import { Component } from "@angular/core";
import { MyService } from "./my.service";

@Component({
  selector: "app-my-component",
  template: `
    <button (click)="handleAction()">Execute Action</button>
  `
})
export class MyComponent {
  constructor(private myService: MyService) {}

  handleAction() {
    this.myService.executeAction("someAction");
  }
}