javascript - 默认情况下，Vuetify 为所有 v-text-field 设置概述

Question

是否有简单的方法可以更改输入项目中所有“v-text-field”的“outlined”属性的默认值？

https://vuetifyjs.com/en/components/text-fields

Answer 1

您可以创建一个包装器组件和 extends来自 VTextField (请参阅 treeshaking )并自定义默认值。

import Vue from 'vue';
import { VTextField } from 'vuetify/lib';

Vue.component('TextFieldOutlined', {
  extends: VTextField,
  props: {
    outlined: {
      type: Boolean,
      default: true
    }
  }
})

使用方式如下:

<text-field-outlined
  label="Some label"
  clearable
  dense>
</text-field-outlined>

FWIW，扩展组件意味着所有基础组件的 props 都会被传递，因此同样可用。