cari

Rumah  >  Soal Jawab  >  teks badan

javascript - masalah undur webapp js

Kini saya menghadapi masalah seperti ini:

对于webapp 有一个活动列表,列表里每个活动有一个倒计时,
一旦把app切入后台,js 计时器就不在生效了,导致倒计时不准确,
有想过解决方法,监听visibilitychange事件,观察document.visibilityState

Saya ingin membuat komponen atau fungsi yang boleh menyelesaikan semua masalah kira detik pada halaman,
tetapi saya terperangkap pada idea saya, saya tertanya-tanya sama ada pakar mempunyai idea, penyelesaian atau maklumat yang bagus?
Terima kasih!


Soalan tambahan:

  1. Semasa saya menyahpepijat pemasa pada telefon saya, saya membuka halaman yang sama dalam WeChat dan penyemak imbas lalai telefon saya,
    bertukar ke latar belakang masing-masing dan mendapati pemasa halaman dalam WeChat masih berjalan dan penyemak imbas lalai telah berhenti berlari.

  2. Apabila mencetak dalam penyemak imbas lalai telefon mudah alih, document.visibilityState tidak ditentukan, tetapi jika halaman web dijalankan dalam WeChat, ia boleh dicetak seperti biasa.

Maaf kenapa? Adakah WeChat melakukan apa-apa untuk menanganinya?

某草草某草草2748 hari yang lalu841

membalas semua(2)saya akan balas

  • 高洛峰

    高洛峰2017-05-19 10:16:09

    Bandingkan dengan masa sistem telefon
    Jika anda masih tidak pasti, bandingkan dengan masa sistem hujung belakang apabila apl dibuka.

    balas
    0
  • 漂亮男人

    漂亮男人2017-05-19 10:16:09

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
    </head>
    <body>
        <p id="app">
            <ul>
                <li v-for="item in items">
                    <com1 :value="item.time"></com1>
                </li>
            </ul>
        </p>
    
        <script src="https://cdn.bootcss.com/moment.js/2.17.1/moment.min.js"></script>
        <script src="http://cdn.bootcss.com/rxjs/5.2.0/Rx.min.js"></script>
        <script src="http://cdn.bootcss.com/vue/2.1.0/vue.min.js"></script>
    
        <script>
            const source = Rx.Observable.interval(1000);
    
            Vue.component('com1', {
                props: ['value'],
                data() {
                    return {
                        count: null,
                    }
                },
                created() {
                    source.subscribe(count => this.count = count % 2);
                },
                template: '<p>距离 {{ value | date("HH:mm:ss") }} 还有 {{ seconds }}s</p>',
                computed: {
                    seconds() {
                        this.count;
                        return Math.abs(moment().diff(this.value, 'seconds'));
                    }
                },
                filters: {
                    date(val, format) {
                        if (val) return moment(val).format(format || 'YYYY-MM-DD HH:mm:ss')
                        return val
                    }
                }
            });
    
            new Vue({
                el: '#app',
                data() {
                    return {
                        items: []
                    }
                },
                created() {
                    for (var i = 0; i < 10; i++) {
                        this.items.push({
                            time: moment().add(i + 1, 'hours')
                        })
                    }
                }
            })
        </script>
    </body>
    </html>

    balas
    0
  • Batalbalas