I am writing a frontend in Vue on ts. I need to pass some logic to the component. In this case it is recommended to use composable function:

const useMyLogic = () => {
  const propA = ref(1);
  const fn = (val) => val * 2;
  return { propA, fn };
};

What is the technical and architectural difference between this approach and using a class?

class MyObject {
  propA: ref(1);
  fn: (val) => val * 2;
}
const getMyObject = () => new MyObject();

When the component calls getMyObject, doesn’t it get the same thing as when useMyLogic? And there are more possibilities to interact with the component from outside.