Uncaught ReferenceError: Семя не определено - PullRequest
Новая
       3

Uncaught ReferenceError: Семя не определено

0 голосов
/ 02 февраля 2020

Я сейчас читаю fullstack vue, и я не понимаю, почему я получаю эту ошибку в этом примере. 

window.Seed = (function () {
    const submissions = [ 
        { 
            id: 1, 
            title: 'Yellow Pail', 
            description: 'On-demand sand castle construction expertise.', 
            url: '#', 
            votes: 16, 
            avatar: '../public/images/avatars/daniel.jpg', 
            submissionImage: '../public/images/submissions/image-yellow.png', 
        } 

    ];
    }());

, это где функция seed. В основном это просто база данных, которую мы используем в этом примере. 

<!DOCTYPE html> 
<html>
    <head>
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.5.3/css/bulma.css">
          <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.6/css/all.css"> 
         <link rel="stylesheet" href="../public/styles.css" /> 
    </head>
    <body>
        <div id="app"> 
            <h2 class="title has-text-centered dividing-header">UpVote!</h2>
            <div class="section"> 
                <article class="media"> 
                    <figure class="media-left"> 
                        <img class="image is-64x64" v-bind:src="submissions[0].submissionImage"> 
                    </figure> 
                    <div class="media-content"> 
                        <div class="content"> 
                            <p> 
                                <strong> 
                                    <a v-bind:href="submissions[0].url" class="has-text-info">
                                     {{ submissions[0].title }} 
                                    </a> 
                                    <span class="tag is-small">
                                        #{{ submissions[0].id }}
                                    </span> 
                                </strong> 
                                <br> 
                                {{ submissions[0].description }} 
                                <br> 
                                <small class="is-size-7"> Submitted by: 
                                    <img class="image is-24x24" v-bind:src="submissions[0].avatar"> 
                                </small> 
                            </p> 
                        </div> 
                    </div> 
                    <div class="media-right"> 
                        <span class="icon is-small"> 
                            <i class="fa fa-chevron-up"></i> 
                            <strong class="has-text-info">{{ submissions[0].votes }}
                            </strong> 
                        </span> 
                    </div> 
                </article> 
            </div>    
        </div>
        <script src="https://unpkg.com/vue"></script>
        <script src="./main.js"></script> 
         <script src="./seed.js"></script> 

    </body>
</html>

Это мой индекс. html

new Vue({
         el: '#app',
         data: { 
            submissions: Seed.submissions 
         }
         });

и, наконец, вот моя главная. js какая роль это соединить индекс. html и начальное число. js. Но это не работает

1 Ответ

1 голос
/ 02 февраля 2020

Вот код, который вы должны попробовать: 

document.addEventListener('DOMContentLoaded', (event) => {
window.Seed = (function () {
    const submissions = [ 
        { 
            id: 1, 
            title: 'Yellow Pail', 
            description: 'On-demand sand castle construction expertise.', 
            url: '#', 
            votes: 16, 
            avatar: '../public/images/avatars/daniel.jpg', 
            submissionImage: '../public/images/submissions/image-yellow.png', 
        } 

    ];
   window.Seed.submissions = submissions;
    }());
})

И в вашем индексе. html файл, добавьте этот код: 

new Vue({
         el: '#app',
         data: { 
            submissions: window.Seed.submissions 
         }
         });

Использование этого решит вашу проблему. Проблема с вашим кодом заключалась в том, что window.Seed had the self-invoking function ничего не возвращает, поэтому вы можете установить свойство представлений в объект window.Seed. Надеюсь, это поможет

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

Нет похожих вопросов

...