vue.jsでfirebaseのデータベースの変更にもリアクティブに反応させられるものでしょうか？

firebaseのリアルタイムデータベース上のデータの変更に応じて、リストレンダリングをしたいのですが、表示されません。（画像A）
membersオブジェクトをローカルでつくって読み込むとうまく表示され、入力するとオブジェクトが更新されるのですが。（画像B）

（画像A）

（画像B）

画像Bの方には、「reactiveGetter」などが付いているようです。

また

app.$forceUpdate();

としてみたのですが、だめです。

 <div id="app">
        <ul>
            <li v-for="m in members">
                <input type="text" v-model:value="m.name">
                <input type="text" v-model:value="m.state">
                <input type="text" v-model:value="m.dest">
            </li>
        </ul>
    </div>
    <script>
        let app = new Vue({
            el: "#app",
            data: {
                members: []
            },
            methods: {
                setWatcher: function ()
                {
                    var ref = firebase.database().ref('/users/' + userID + '/members');
                    ref.on('value', function (snapshot)
                    {
                        this.members = snapshot.val();
                        console.log(members); // ログにArrayが表示される
　　　　　　　　　　　　　　 app.$forceUpdate(); // 効かない模様
                    });
                }
            },
            created: function ()
            {
                this.setWatcher();
            }
        }) 
    </script>