Как сделать динамический реквизит для элемента пользовательского интерфейса

Question

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

pickerOptions: {
  type: Object,
  default: () => ({
    addedProp: '',
    defaultProp: 'firstDayOfWeek: 1',    
  }),
},

Как я могу сделать addedProp динамичным. Как я могу установить эту опору внутри компонента. defaultProp всегда должно быть активным по умолчанию. addedProp должен быть похож на тумблер, только если нужно.

Answer 1

Исправлено с помощью:

        computed: {
          combinedPickerOptions() {
              return {
                  firstDayOfWeek: 1,
                  ...this.pickerOptions,
              };
          },
       },

Решение - оператор распространения. Теперь я могу установить "firstDayOfWeek" по умолчанию и установить дополнительные параметры, если это необходимо.

Answer 2

Я не уверен, правильно ли я вас понимаю, но вы можете изменить pickerOptions на вычисленные данные, как здесь: https://jsfiddle.net/Lczj0ndp/1/

    data() {
      return { dynamicValue: '' };
    }
    computed: {
      pickerOptions1() {
        return { 
          someOption: this.dynamicValue,
          ...
        }
      }

и затем вы можете сделать один или несколько из ваших параметров динамическими.

Подробнее о вычисленных данных вы можете прочитать здесь .