Как продлить от VTextField? - PullRequest
Новая
       36

Как продлить от VTextField?

0 голосов
/ 24 октября 2018

Я хочу установить значения по умолчанию для реквизита VTextField, чтобы добиться этого, я расширил его и перезаписал некоторые реквизиты по умолчанию: 

<script>
import VTextField from 'vuetify/es5/components/VTextField';
const theme_config = require('@/theme/config.json');
export default {
    name: 'my-text-field',
    extends: VTextField,
    props: theme_config.components.default_input,
};
</script>

config.json выглядит следующим образом: 

{
    "components": {
        "default_input":{
            "color": {
                "default": "secondary"
            },
            "outline": {
                "default": true
            }
        }
    }
}

родительский компонент, который использует my-text-field, выглядит следующим образом: 

<template>
    <my-text-field 
        type="text" 
        append-icon="person"
    >
    </my-text-field>
</template>

, но когда vue рендерит, он меняет my-text-fiel на v-text-field:

captured from VueDevTools

это не первый раз, когда я расширяю компонент Vuetify, он прекрасно работает с кнопкой, я понятия не имею, что происходит

1 Ответ

0 голосов
/ 25 октября 2018

Я не первый раз отвечаю на свои вопросы, но я отвечал, потому что, возможно, здесь есть другие люди, у которых такая же проблема.

Проблема с компонентом v-text-field заключается в том, чтоон был разработан для использования многострочных и однострочных символов; для этого они помещают обертку в индекс, но в новом Vuetify2 это устареет, поэтому теперь у них есть два компонента, которые вы можете использовать самостоятельно.Вот почему я изменил исходный текстовый ввод index.js на один свой, который импортирует VTextInput, как и другие компоненты, на vuetify.

это мой index.js 

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});
exports.VTextField = undefined;

var _VTextField = require('./VTextField');

var _VTextField2 = _interopRequireDefault(_VTextField);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

exports.VTextField = _VTextField2.default;
exports.default = _VTextField2.default;

Thisэто не причудливое решение, но, возможно, оно поможет другим решить проблему.

...