Данные через реквизит не отображаются - PullRequest
Новая
       8

Данные через реквизит не отображаются

0 голосов
/ 09 февраля 2019

Мне удалось немного запутаться.У меня есть приложение, в котором я могу отображать все профили пользователей, этот компонент называется все-профили.Примером этой страницы является 

<tr v-for="profile in profiles.data" :key="profile.id">
    <td>{{ profile.id }}</td>
    <td>{{ profile.user.name }}</td>
    <td>{{ profile.created_at }}</td>
    <td>
        <router-link :to="{ name: user-profile, params: {
             id: profile.id }}" tag="a" exact> View Profile
        </router-link>
    </td>
</tr>

Так что здесь ничего сложного, только простой цикл.Когда вы нажимаете router-link для определенного профиля, вы переходите на эту страницу, компонент под названием user-profile.Я передаю идентификатор профиля в качестве параметра.

Поэтому в компоненте профиля пользователя я отображаю информацию об этом профиле.Большая часть работы выполняется в созданной функции 

created() {
    let vm = this;

    let url = `/api/profile/${this.$route.params.id}`;
    axios.get(url)
        .then(response => {
            this.profile = response.data;
            this.fileName = response.data.file_path;
            return d3.json(response.data.file_path);
        }).then(data => {
            //display some data
        }).catch(err => {
            //log error
        });
}

Поэтому я сначала делаю вызов axios, чтобы получить информацию об этом профиле.У каждого профиля есть file_path, который содержит некоторые обработанные данные в форме JSON.Я загружаю это с помощью d3 и отображаю данные.Это также работает нормально, никаких проблем здесь.Проблема находится на этой странице, однако, внутри тегов шаблона я загружаю другой компонент, которому нужен file_path для отображения некоторых данных в файле в форме диаграммы.Итак, у меня есть 

<barchart :file-name = this.fileName></barchart>

Теперь, если я выведу fileName на странице профиля пользователя, я вижу, что это правильно.Теперь в компоненте barchart у меня есть prop 

props: {
    fileName: {
        type: String,
        required: true
    }
}

А затем в созданной функции у меня есть 

created() {
    console.log(this.fileName);
}

Так что должен вывести fileName, который я передаю через prop,но в настоящее время он ничего не выводит.Раньше у меня это работало, но я использовал параметры маршрута и хотел вместо этого переключать вещи на реквизиты.

У меня такое ощущение, что, возможно, компонент barchart загружается до того, как fileName будет правильно установлен?

Я не уверен, есть ли что-нибудь очевидное, что может не привести к выводу ничего?

Спасибо

1 Ответ

0 голосов
/ 09 февраля 2019

Это так же просто, как: вы используете ": filename = this.filename" в шаблоне?«Это» кажется неуместным?

...