Untitled

import { defineComponent, ref } from 'vue';

import styles from './my-component.module.css';

export const MyComponent = defineComponent({
  name: 'MyComponent',
  props: {
    topText: {
      type: String,
      required: true, 
    },
  },
  setup(props) { 
    const myData = ref('Initial data');

    function changeText() {
      myData.value = 'New data';
    }

    return (
      <div>
        <div>{props.topText}</div> {}
        <div>{myData.value}</div> {}
        <button type="button" class={styles.button} onClick={changeText}>
          Время менять надпись
        </button>
      </div>
    );
  },
});

import { defineComponent } from 'vue'
import { MyComponent } from '~/components/my-component/my-component'
import styles from './test.module.css'

export default defineComponent({
  name: 'TestPage',
  setup() {
    return () => (
      <div class={styles.block}>
        <MyComponent topText={'вжух'} />
      </div>
    )
  },
})