将Vuetify全局主题与Vue组件一起使用Vue-Form-Generator

时间:2019-12-07 21:08:33

标签: vue.js vuetify.js

我有一个vue应用,正在使用vue-form-generator创建我的第一个表单。我在项目中添加了vuetify,并在vuetify.js文件中设置了一个全局主题,如下所示。

const vuetify = new Vuetify({
  theme: {
    themes: {
      light: {
        primary: colors.purple,
        secondary: colors.grey.darken1,
        accent: colors.shades.black,
        error: colors.red.accent3,
      },
      dark: {
        primary: colors.blue.lighten3,
      },
    },
  },
})

此主题以及将主题更改为“黑暗”模式似乎不适用于我拥有的vue-form-generator组件。我正在寻求有关如何使其适用的帮助。

组件示例:

<template>
  <v-container>
    <div class="panel panel-default">
      <div class="panel-heading">Create Template</div>
      <div class="panel-body">
        <vue-form-generator ref="vfg" :schema="schema" :model="formModel" :options="formOptions"></vue-form-generator>
      </div>
      <div class="panel-heading">You can add an email body on the next step</div>
    </div>
  </v-container>
</template>

<script src="./create-form.js"></script>
<style src="./create-form.css"></style>

对于我所有其他视图,这似乎没有添加任何额外的代码就可以工作。不知道这是否可能是因为它是一个组件,而不仅仅是View。如果需要的话,我会添加我的JS文件,但是它会超过一百行

0 个答案:

没有答案