How to change element hint dynamically with Vuetify 3?

Question

This is my component.vue:

<template>
  <v-text-field
      name="Foo"
      :label="$t('foo')"
      type="text"
      hint="This is a hint"
      persistent-hint
  ></v-text-field>
  <v-btn color="primary" @click="onButtonClick()">Press</v-btn>
 </template>

And this is component.ts

import { defineComponent, reactive, ref, Ref} from 'vue';
export default defineComponent({

  setup() {
     
    function onButtonClick() {
      
    }    
    return { onButtonClick }
  }
});

I want to change hint on button click, for example to This is a new hint. Could anyone say how to do in Vuetify 3 using Composition API?