vue prop всегда является значением по умолчанию внутри дочерней композиции - PullRequest
Новая
       2

vue prop всегда является значением по умолчанию внутри дочерней композиции

0 голосов
/ 07 мая 2020

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

Overview.vue (child)

  props: {
    name: {
      type: String,
      default: ''
    },
    title: {
      type: String,
      default: ''
    },
    username: {
      type: String,
      default: ''
    },
    email: {
      type: String,
      required: true,
      default: ''
    },
    phone: {
      type: Number,
      default: null
    },
    status: {
      type: String,
      required: true,
      default: ''
    },
    statusOptions: {
      type: Array,
      default: () => []
    }
  },

мой родитель выглядит так:

UserSettings.vue (parent) 

          <overview
            :name="name"
            :username.sync="username"
            :email="email"
            :status="status"
            :status-options="statusOptions"
            @update-username="username = $event"
          />

UserSettings.vue data (parent)

  data() {
    return {
      name: 'John',
      username: 'Nevermind',
      email: 'john.nevermind@okey.com',
      status: 'idle',
      statusOptions: ['idle', 'vacation', 'working']
    }
  }

внутри моего дочернего компа, я хочу сохранить переданные данные внутри моего data() вот так:

Overview.vue (child) 

  data() {
    return {
      overviewData: {
        username: this.username,
        email: this.email,
        phone: this.phone,
        status: this.status
      }
    };
  },

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

1 Ответ

0 голосов
/ 08 мая 2020

Я подозреваю, что есть ошибка в том, как вы отображаете данные в <overview> (или иным образом определяете, что они пустые). См. Рабочую песочницу здесь . Не стесняйтесь редактировать обзорную реализацию, чтобы мы могли вас отсортировать.

...