如何使用 firebase-document 在 Polymer 2.x 的空 Firebase 节点处初始化 'settings'？

Question

我想实现 <firebase-document> 来获取和应用用户设置。 I am using this page as a guide.

当我在 firebase 的 /users/{{userId}}/settings 节点加载没有数据的页面时，我希望看到对象 { new: 'initial', j: 5, o: 'N' }) 加载到那里。但是，我实际上在我的 firebase 中看到节点没有变化。

我哪里做错了，我怎样才能达到我想要的行为？

settings.html

<firebase-document
  path="/users/{{userId}}/settings"
  data="{{data}}">
</firebase-document>

<script>
Polymer({
  properties: {
    uid: String,
    data: {
      type: Object,
      observer: 'dataChanged'
    }
  },

  dataChanged: function (newData, oldData) {
    // if settings have not been set yet, initialize with initial value
    if(!newData && !oldData){
      this.set('data', { new: 'initial', j: 5, o: 'N' });
    }
  }
});
</script>

编辑：通过@HakanC 的评论回答问题：

Does {{userId}} have a value when executed?

是的。

Is there data at the path /users/{{userId}}/settings?

没有。用户首次登录时没有 /settings 节点。但我确实有在 /users/{{userId}} 处成功创建节点的代码。当此元素执行其脚本时，该节点存在。

Console log whether you arrive this.set line.

我确实到达那里——多次。第一次，data 的记录值未定义。第二次，data 的记录值为 {}.

Answer 1

你上面说的路径上没有数据，那么你需要改变if条件。类似于：

if(newData === undefined){

而不是；

if(!newData && !oldData){

编辑：

static get properties() { return { 
            uid: String,
            data:{
               type:Object,
               value() {return{}; }
              }
            }
          }
      static get observers() { return [ 'dataChanged(data)' ]} 


            constructor() {
              super();
            }

            ready() {
                super.ready();
                setTimeout(()=> {
                  this.set('data', undefined); //Retrieving data async from firebase.           
                },500)
            }

    dataChanged(data) {
    // if data has not been set then, initialize with new value
      console.log(data);
      if(!data){
        this.set('data', { new: 'initial', j: 5, o: 'N' });
      }
    }

DEMO

如何使用 firebase-document 在 Polymer 2.x 的空 Firebase 节点处初始化 'settings'？

How to initialize 'settings' at an empty Firebase node in Polymer 2.x using firebase-document?

firebase

polymer

firebase-realtime-database

polymerfire

polymer-2.x