javascript - Firebase功能完成后如何修复在HTML5中检索数据？

Question

我似乎找不到错误。在下面的代码中，当我更改资产字段时，我将值发送到 firebase，然后函数以状态完成：'ok'。

并且 value 事件方法不会读取数据库路径处的数据更改

firebase.database().ref("code/" + uuid + "/result")

请问你能帮帮我吗？

这是我的代码。

<div class='asset'></div>
<main class="app__content prop-to-show hidden" style="height: inherit;"></main>
<main class="app__content data-to-show hidden" style="height: inherit;"></main>

<script src="https://www.gstatic.com/firebasejs/5.9.0/firebase.js"></script>
<script>
    var config = { ... };
    firebase.initializeApp(config);
</script>

<script type="module">
    import PPE from "../js/ppe.min.js";
    PPE.WORKER_PATH = '../js/ppe-worker.min.js';

    // step 1.: Working fine
    document.querySelector('.asset').addEventListener("change", coPPE);
    function coPPE() {
      const asset = document.querySelector('.asset').value;
      const re = new PPE (asset, result => setResult(result));
    };

    // step 2.: Working fine
    async function setResult(content) {
        await setID(content);
    };

    // step 3.: Working fine
    function setID(reid) {
        var uid = firebase.auth().currentUser.uid;
        var d = new Date();
        var timestamp = d.getTime();
        firebase.database().ref("ppe/" + uid).set({
            code: reid,
            timestmp: timestamp
        });
    };
</script>
<!--
    step 4.: Working fine - cloud function set 'firebase.database().ref("code/" + id + "/result");' wnen ref('ppe/{Id}') is updated;
-->
<script type="text/javascript">
    // step 5.: Nothing happens after step 4
    var uuid = firebase.auth().currentUser.uid;
    var statusRef = firebase.database().ref("code/" + uuid + "/result");
    statusRef.on('value', function (snapshot) {
        var getPropertyValue = snapshot.val();
        var list = document.querySelector('.data-to-show');
        var content = '';
        while (list.firstChild) {
            list.removeChild(list.firstChild);
        }
        if (getPropertyValue.rs == 0) {
            content = "<div class='verified y5p' id='ok'> ... </div>";
        } else if (getPropertyValue.rs == 1) {
            content = "<div class='doublecheck y6p' id='twice'> ... </div>";
        } else if (getPropertyValue.rs == 2) {
            content = "<div class='notverified y7p' id='reject'> ... </div>";
        }
        document.querySelector('.data-to-show').innerHTML = content;
        document.querySelector('.prop-to-show').classList.add('hidden');
        document.querySelector('.data-to-show').classList.remove("hidden");
    }, function (error) {
        console.log("Error: " + error.code);
    });
</script>

标签： javascripthtmlfirebasefirebase-realtime-databasegoogle-cloud-functions