Не работает watch для <script setup> во VueJS

Создавая новый проект на VueJS, решил попробовать использовать <script setup>. Все шло хорошо, объем кода прилично сократился. Но вот пришла беда, откуда не ждали - перестал работать watch.

В проекте используется InertiaJS и, в частности, flash сообщения. Задача была - выводить всплывающее сообщение, например, при успешном удалении записи. При этом InertiaJS не перезагружает всю страницу, а только измененную ее часть.

Старая структура документа вида:

<script>
export default defineComponent({
    data(){},
    computed:{},
    watch:{
        'this.$page.props.value.flash.message': function (val) {
            // <show toast>
        }
    }
})
</script>

А вот в новом формате и с использованием CompositionAPI работать отказалась.

Непродолжительные поиски ответа привели к тому, что конструкция 'this.$page.props.value.flash.message' не является реактивной и решение оказалось довольно простым: нужно сделать эту конструкцию реактивной через использование функции ref. В коде ниже сделано computed свойство для упрощения кода.

<script setup>
const _foo = ref((usePage().props.value.flash as any).message)
 
const pageFlashMessage = computed(() => {
    return (usePage().props.value.flash as any).message
})
 
watch(() => pageFlashMessage, () => {
    if (pageFlashMessage.value) {
        useToast().success(pageFlashMessage.value)
    }
}, {deep: true})

</script>