firebase - 在 Firebase 中设置/更新数据之前必须明确删除“.key”

Question

我创建了一个 Vue/Vuefire 组件，用于编辑现有的 Widget 并将编辑内容保存到 Firebase。

小部件上的一些反应性属性不应保存到 Firebase，例如错误消息以及小部件当前是否显示。所以我将所有 Firebase 数据存储在一个firebaseData属性中：

Vue.component('widgetForm', {
    template: '#myWidgetFormTemplate',
    props: ['firebaseKey'],
    data: function(){
        return {
            error: '',
            isShown: false,
            firebaseData: {}
        }
    },
    methods: {
        show: function(){
            var form = this;
            form.isShown = true;
            form.$bindAsObject('firebaseData', fb.ref('/widgets').child(form.firebaseKey));
        },
        save: function(){
            var form = this;
            delete form.firebaseData['.key']; // This seems weird
            form.$firebaseRefs.firebaseData.set(form.firebaseData, function(err){
                if(err) form.error = err;
            });
        }
    }
});

问题是保存数据时，我总是得到错误First argument contains an invalid key (.key)。我的解决方案是显式删除该.key属性，如上所述。

这感觉就像代码的味道。有没有办法不必这样做？

Answer 1

作为替代方案，您可以直接使用 firebase 而不是 vuefire。

methods: {
  show: function() {
    var form = this;
    form.isShown = true;
    fb.ref(`/widgets/${form.firebaseKey}`)
      .on('value')
      .then(snapshot => {
        form.firebaseData = snapshot.val();
      });
  },
  save: function() {
    var form = this;

    fb.ref(`/widgets/${form.firebaseKey}`).set(form.firebaseData, function(err) {
      if (err) form.error = err;
    });
  }
}