vuetify 断点未定义，类型错误：无法读取未定义的属性'xsOnly'

Question

:class="{ 'pa-0': noPadding, 'pa-4': !noPadding && $vuetify.breakpoint.xsOnly }"

在devtool我有错误

TypeError: Cannot read property 'xsOnly' of undefined

有什么问题吗?

我app.js

import Vuetify from 'vuetify';
Vue.use(Vuetify);

version vuetify 2.4.5

Answer 1

首先需要通过computed:

导入它

computed: {
xsOnly() {
return this.$vuetify.breakpoint.xsOnly;
}
}

然后用它来模板:

:class="{ 'pa-0': noPadding, 'pa-4': !noPadding && xsOnly }"

Answer 2

我可以想象您只需要在前面加上这个::class="{ 'pa-0': noPadding, 'pa-4': !noPadding && this.$vuetify.breakpoint.xsOnly }"所以你不一定需要计算属性。我相信你在Vuetify中定义了xsOnly，这样它就不会返回'undefined'