Динамическое создание реквизита

Как вы динамически создаете реквизиты из хука миксина / жизненного цикла в vue?

Я пробовал следующее:

function install(Vue, Options) {
    Vue.mixin({
        beforeCreate: function() {
            this.$options.props = {
                name: {
                    type: String
                },
                age: {
                    type: Number
                },
                gender: {
                    type: String
                }
            }
        }
    })  
}

const PropEditor = {install}
module.exports = PropEditor

но приведенный выше код не работает. Я также пробовал использовать this.props = {... и это тоже не работает.

Я прошел через каждую строку в отладчике и внимательно изучил внутренние функции инициализации vue, но я не могу понять, почему не устанавливаются реквизиты.

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


person Tony J Watson    schedule 23.06.2020    source источник
comment
вы можете получить доступ к vm. $ attrs   -  person Estradiaz    schedule 23.06.2020
comment
@Estradiaz, я не уверен, как использовать vm. $ Attrs для установки реквизита   -  person Tony J Watson    schedule 23.06.2020
comment
Короткий ответ - проверьте github vue src, но в основном все, что не назначено в props, останется в attrs, поэтому вы можете захватить их во время выполнения и установить их на экземпляр vm и т.д., но проверьте, как props работают в исходном коде;)   -  person Estradiaz    schedule 23.06.2020
comment
github.com/vueb.com/vueb.com/vueb. и, наконец, где все происходит   -  person Estradiaz    schedule 23.06.2020
comment
Хорошо, хм, твое действительно может работать ??   -  person Estradiaz    schedule 23.06.2020
comment
Да, я так думал, но я много раз тестировал, и это не так.   -  person Tony J Watson    schedule 23.06.2020
comment
Если я помещаю console.log, он запускается ... и я могу пройти через отладчик, но он никогда не устанавливает реквизиты   -  person Tony J Watson    schedule 23.06.2020
comment
Можете ли вы поставить здесь точку останова   -  person Estradiaz    schedule 23.06.2020
comment
Хорошо, я попробовал это ... все еще не мог заставить его работать. Я думаю, это может иметь какое-то отношение к propsData в initProps   -  person Tony J Watson    schedule 24.06.2020


Ответы (2)


Вместо того, чтобы пытаться добавить реквизиты в beforeCreate, объявите props в своем объекте миксина:

Vue.mixin({
  props: {
    name: {
      type: String
    },
    age: {
      type: Number
    },
    gender: {
      type: String
    }
  }
})
person tony19    schedule 23.06.2020
comment
Реквизит должен быть сгенерирован, поэтому мне нужно вызвать его из функции - person Tony J Watson; 23.06.2020

Как вы заметили, и мой первый комментарий был упомянут: это о vm.$attrs:

beforeCreate(){
  this.$options.props = {propName: {}};
  this.$options.propsData = this.$attrs;
}

но имейте в виду, что вам нужно удалить эти реквизиты из attrs, чтобы оставаться в соответствии с vue, например:

Object.keys(this.$options.props).forEach(key => this.$attrs.hasOwnProperty(key) && delete this.$attrs[key])

надеюсь это поможет ;)

person Estradiaz    schedule 24.06.2020