Version

3.0.2

Reproduction link

https://jsfiddle.net/d0w5Lahm/

Steps to reproduce

import { onServerPrefetch } from 'vue';

// onServerPrefetch, seems to not exist

What is expected?

To be able to use serverPrefetch with the new composition api

What is actually happening?

onServerPrefetch is undefined

import { onServerPrefetch } from '@vue/composition-api' }

// onServerPrefetch exist

The vue composition API for Vue 2 has this feature.

It's call serverPrefetch in vue3

You should be able to use async setup + Suspense to create the same behavior as serverPrefetch

Thank you for these answers. In my mind it was not possible to mix defineComponent and serverPrefetch

export default defineComponent({
  setup() {
    const users = ref([]);
    const fetch = async () => {
      console.log('fetching ...');
      const { data } = await axios.get('https://reqres.in/api/users?page=2');
      users.value.splice(0, users.value.length, ...data.data);
    };
    if (typeof window !== 'undefined') {
      fetch();
    }
    return {
      users,
      fetch,
    };
  },
  async serverPrefetch() {
    await this.fetch();
  },
});