有沒有辦法在設定函數中存取 $vuetify (以及任何其他新增的全域)? 有沒有辦法讓可組合項存取它?
... setup() { const { isDesktop } = $vuetify.breakpoints.mdAndUp; // <=== how to get $vuetify return { isDesktop }; },
可組合取得 vuetify 實例:
// 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 }
將其導入您的元件中:
<!-- 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>
如果您使用的是Vue @vue/composition-api 而不是Vue 2.7,請將'vue' 替換為'@vue /composition-api'
'vue'
'@vue /composition-api'
可組合取得 vuetify 實例:
將其導入您的元件中:
如果您使用的是Vue @vue/composition-api 而不是Vue 2.7,請將
'vue'
替換為'@vue /composition-api'