Uncaught (в обещании) TypeError: не удается прочитать свойство 'inner HTML', равное нулю? - PullRequest
0 голосов
/ 29 мая 2020

Я пытаюсь получить URL-адрес изображения и имя из базы данных облачного хранилища данных, но получение не удалось и не показало никакого значения на веб-странице. После проверки правильное значение печатается внутри консоли, но вместе с этой консолью отображается некоторая ошибка во внутреннем HTML. Может ли кто-нибудь просмотреть оба кода (Html и Js) и сказать мне, где ошибка и ошибки, которые я сделал?

Ошибка:

defualt.js:22 Uncaught (in promise) TypeError: Cannot read property 'innerHTML' of null
at defualt.js:22
at database.ts:2202
at document_set.ts:97
at Wg.ut (sorted_map.ts:324)
at Wg.ut (sorted_map.ts:323)
at Hg.ut (sorted_map.ts:136)
at k_.forEach (document_set.ts:96)
at gN.forEach (database.ts:2201)
at defualt.js:8
* 1005 мне, как получить ImageUrl из базы данных облачного хранилища на веб-сайт. Я делаю веб-сайт, который будет извлекать только изображение профиля и имя пользователя вместе и отображаться внутри веб-сайта. Я уже загрузил изображение в хранилище firebase и сохранил ссылку ImageUrl в базе данных облачного хранилища. Я просто хотел получить изображение профиля и имя, которые уже хранятся в моей облачной базе данных.

Пожалуйста, помогите мне, я столкнулся с этой проблемой за последние 5 дней, и я смогу c найти результат. Я прочитал документацию по firestore, но она мне не очень помогает. Я попробовал приведенный ниже код, но он не работает, сохраненные значения не

Js код:

db.collection("student entry").get().then(function(querySnapshot) {
  querySnapshot.forEach(function(doc) {
      // doc.data() is never undefined for query doc snapshots
      console.log(doc.id, " => ", doc.data());

      var posts_div=document.getElementById('#posts');
 posts.innerHTML="";
 var data=doc.data();
 console.log(data);
for(let[key,value] of Object.entries(data)){
posts_div.innerHTML="<div class='col-sm-4 mt-2 mb-1'>"+
"<div class='card'>"+
"<img src='"+value.image+"' style='height:250px;'>"+
"<div class='card-body'><p class='card-text'>"+value.fname+"</p>"+
"<button class='btn btn-danger' id='"+key+"' onclick='delete_post(this.id)'>Delete</button>"+
"</div></div></div>"+posts_div.innerHTML;

}
  });
});

HTML код:

<html>
    <head>
        <title>Blogs</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    </head>
    <body>
        <div class="container mt-2">

            <div class="row mt-4" id="posts">

            </div>

        </div>

<!-- The core Firebase JS SDK is always required and must be listed first...make sure you remove -app from below line -->
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase.js"></script>

<script>
    // Initialize Firebase
    var config = {
        apiKey: " ",
        authDomain: " ",
       databaseURL: " ",
       projectId: " ",
       storageBucket: " ",
      messagingSenderId: " ",
      appId: " ",
      measurementId: " "
    };
    firebase.initializeApp(config);
    var db = firebase.firestore();
    db.settings({ timestampsInSnapshots: true }); 
</script>


        <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
        <script src="defualt.js"></script>
    </body>
</html>

enter image description here

1 Ответ

0 голосов
/ 29 мая 2020

Вам не нужно # при использовании getElementById. document.getElementById('posts'); должно работать.

...