bug: vue, elements not shown at the moment did enter lifecycle is fired

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

- [ ] v4.x
- [X] v5.x
- [X] v6.x

### Current Behavior

create a reference in dom, which is inside Icon-vue component, then get the config "offsetHeight", "offsetWidth", "clientHeight", "clientWidth" of the dom in lifecycle onMouted, but their value are all zero, and when I add setTimeout function to get config, it will get real value.

### Expected Behavior

it can get the real value of config "offsetHeight", "offsetWidth", "clientHeight", "clientWidth" of the dom reference in lifecycle onMouted.

### Steps to Reproduce

1. set dom reference inside ionic-vue component
2. in lifecycle onMouted, get the config "offsetHeight", "offsetWidth", "clientHeight", "clientWidth" value

here is the code:

```

import { defineComponent, ref, onMounted } from 'vue';
import { IonPage } from '@ionic/vue';

export default defineComponent({
name: 'App',
components: {
IonPage
},
setup() {
const domRef = ref<HTMLElement | null>(null)

onMounted(() => {
console.log(domRef.value) // it can get dom reference
console.log(domRef.value?.offsetHeight) // but the value is zero
console.log(domRef.value?.offsetWidth)
console.log(domRef.value?.clientHeight)
console.log(domRef.value?.clientWidth)
})

return {
domRef
}
}
});

```

### Code Reproduction URL

_No response_

### Ionic Info

_No response_

### Additional Information

_No response_