Когда реквизит обновляется в жизненном цикле VueJS

Question

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

My (очень упрощенный) компонент выглядит следующим образом:

export default { 
    props: [ 
     'columns', 
    ], 
    mounted: function() { 
     console.log(this.columns) 
    } 
} 

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

<script> 
    import DatatableHeader from './DatatableHeader.vue'; 

    export default { 
     data: { 
      columns: [{'heading': 'Column 1'}, {'heading': 'Column 2'}] 
     }, 
     components: { 
      'datatableheader' : DatatableHeader, 
     } 
    } 
</script> 

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

Я что-то не так? Или есть другой крючок жизненного цикла, который я должен использовать.

Спасибо!

Answer 1

Короткий ответ: вы можете получить доступ к реквизитам в установленном крюке. Если вы проверите эту скрипку, вы увидите, что предупреждение успешно показывает заголовок столбца. https://jsfiddle.net/yj3k1wLx/1/ Тот факт, что ваша программа запущена, но возвращает пустой массив, кажется, указывает, что вы фактически не проходите в массиве столбцов. <test :columns="columns"> Сравните скрипт с кодом и посмотрите, есть ли у вас неправильная ссылка или переменная.

Обновление Простой ответ на ваш комментарий заключается в том, чтобы изменить корневой крюк на созданный вместо установленного. Но у меня такое чувство, что ты об этом поступил неправильно. Теперь я не видел ваш код, но я думаю, что проблема заключается в обновлении массива. Прочитайте здесь предостережения https://vuejs.org/v2/guide/list.html#Caveats, а затем ознакомьтесь с этой обновленной демонстрацией https://jsfiddle.net/yj3k1wLx/4/