Question #140

import { ref } from 'vue';

export function useSomeComposable() {
  const counter = ref(1);

  function increaseCounter() {
    counter.value += 1;
  }

  return {
    counter,
    increaseCounter,
  };
}

<template>
  <span>
    {{ counter }}
  </span>
</template>

<script setup>
import { useSomeComposable } from './useSomeComposable';

const { counter, increaseCounter } = useSomeComposable();
increaseCounter();
</script>

<template>
  <div>
    <SomeComponent1 />
    and
    <SomeComponent2 />
  </div>
</template>

<script setup>
import SomeComponent1 from '../components/SomeComponent1.vue';
import SomeComponent2 from '../components/SomeComponent2.vue';
</script>