Как исправить ReferenceError, не определенную при передаче реквизита от лезвия Laravel к компоненту Vue

Question

Я пытаюсь использовать компонент Vue.js в Laravel, но не могу передать реквизит от блейда к компоненту js.Консоль сообщает [Vue warn]: Error in mounted hook: "ReferenceError: clientId is not defined"

Я попытался переименовать опору в blade-/ js, используя: client-id, client, v-client и т. Д., И упростил столько, сколько смог, но все еще могуне заставит это работать.Выглядит почти так же, как фрагмент кода, который я успешно использовал в других местах.

show.blade.php

<archive-button client-id="1"></archive-button>

archiveButton.js

<script>
export default {
  props: ["clientId"],

  mounted() {
    console.log("id:" + clientId);
  }
};
</script>

Я ожидаюclientId должен отображаться в консоли как id:1, но вместо этого он сообщает

[Vue warn]: Error in mounted hook: "ReferenceError: clientId is not defined"

found in

---> <ArchiveButton> at resources/js/components/archiveButton.vue

Возможно, это ошибка школьника, но я смотрю на нее и целую вечность чешу голову ... Может кто-нибудь увидетьпроблема?

Answer 1

Это не имеет никакого отношения к Laravel

Изменить

  mounted() {
    console.log("id:" + clientId);
  }

на

  mounted() {
    console.log("id:" + this.clientId);
  }