Comment accéder à l'instance $vuetify dans la fonction de configuration

Question

Existe-t-il un moyen d'accéder à $vuetify (et à tout autre global ajouté) dans la fonction de paramètres ? Existe-t-il un moyen d'y donner accès aux composables ?

  ...
  setup() {
    const { isDesktop } = $vuetify.breakpoints.mdAndUp; // <=== how to get $vuetify
    return { isDesktop };
  },

Answer 1

Les instances Vuetify peuvent être obtenues en combinaison :

// useVuetify.ts
import { getCurrentInstance } from 'vue'

export function useVuetify() {
  const instance = getCurrentInstance()
  if (!instance) {
    throw new Error(`useVuetify should be called in setup().`)
  }
  return instance.proxy.$vuetify
}

Importez-le dans votre composant :

<!-- MyComponent.vue -->
<script lang="ts">
import { useVuetify } from './useVuetify'
import { computed } from 'vue'

/*...*/
  setup() {
    const vuetify = useVuetify()
    const isDesktop = computed(()=>vuetify.breakpoints.mdAndUp)
    return { isDesktop }
  },
/*...*/
</script>

Si vous utilisez Vue <= 2.6.14 + @vue/composition-api au lieu de Vue 2.7, veuillez remplacer 'vue''vue' 替换为 '@vue /composition-api' par '@vue /composition-api'

🎜