首页 > 解决方案 > Vuetify 设置从右到左的文本

问题描述

我添加Vuetify使用:

vue add vuetify

生成的文件如下所示:

import Vue from "vue";
import App from "./App.vue";
import vuetify from "./plugins/vuetify";

Vue.config.productionTip = false;

new Vue({
  vuetify,
  render: (h) => h(App)
}).$mount("#app");

我尝试添加RTL进行休闲:

import vuetify from "./plugins/vuetify";

const Vuetify = new vuetify({
  rtl: true
});;
Vue.config.productionTip = false;

new Vue({
  Vuetify, 
  render: (h) => h(App)
}).$mount("#app");

出现错误:Uncaught TypeError: _plugins_vuetify__WEBPACK_IMPORTED_MODULE_8__.default is not a constructor

并尝试了这个:

Vue.use(Vuetify, {
  rtl: true
})

Vue.config.productionTip = false;

new Vue({
  render: (h) => h(App)
}).$mount("#app");

得到错误: Error in beforeCreate hook: "Error: Vuetify is not properly initialized,

我错过了什么?

标签: vue.jsvuetify.js

解决方案


你没有在正确的地方改变它。看起来您正在尝试修改文件main.js,您应该src/plugins/vuetify.js改为修改文件。还要确保按照文档export default中的描述进行操作。

像这样:

// src/plugins/vuetify.js

import Vue from 'vue'
import Vuetify from 'vuetify/lib'

Vue.use(Vuetify)

export default new Vuetify({
  rtl: true,
})

推荐阅读