Vue Component prop в компоненте vuetify - PullRequest
0 голосов
/ 11 декабря 2018

Я не могу передать данные в мой пользовательский компонент, мой компонент использует vuetify, в настоящее время я не получаю никаких сообщений:

МОЙ компонент:

<template>
  <v-layout>
    <v-flex xs12 sm6 offset-sm3>
      <v-card>
        <v-img
          src="https://cdn.vuetifyjs.com/images/cards/desert.jpg"
          aspect-ratio="2.75"
        ></v-img>

        <v-card-title primary-title>
          <div>
            <h3 class="headline mb-0">{{ tenantName }}</h3>
            <div>{{ tenantDescription }}</div>
          </div>
        </v-card-title>
      </v-card>
    </v-flex>
  </v-layout>
</template>

<script>
  export default {
    data () {
      return {
        // ...
      }
    },

    props: ['tenantImage', 'tenantName', 'tenantDescription']
  }
</script>

И вот как явызов на мой взгляд:

                    <tenant-card
                        imgSrc="https://fuckoffgoogle.de/wp-content/uploads/2017/12/cropped-logo_midres-1.png"
                        :tenantName="my Name is"
                        :tenantDescription="this is a description"
                    ></tenant-card>

Компонент зарегистрирован, я вижу его на моем виде просто без каких-либо данных.

Я получаю это снаружи в источнике страницы <div class="layout" tenantimage="https://fuckoffgoogle.de/wp-content/uploads/2017/12/cropped-logo_midres-1.png" tenantname="my Name is" tenantdescription="this is a description"> ...

1 Ответ

0 голосов
/ 11 декабря 2018

Имена ваших свойств неверны:

<tenant-card
   tenant-image="'https://fuckoffgoogle.de/wp-content/uploads/2017/12/cropped-logo_midres-1.png'"
   :tenant-name="'my Name is'"
   :tenant-description="'this is a description'">
</tenant-card>

Имена атрибутов HTML не чувствительны к регистру.Любой заглавный символ будет интерпретирован как строчный.Поэтому имена проповеди camelCased должны использовать их эквиваленты в кебабе.

Редактировать: И, как уже упоминалось @Sergeon, вы должны добавить дополнительные '', чтобы передать строку в качестве значения свойства

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...