Необходимость явного удаления ".key" перед установкой / обновлением данных в Firebase

Question

Я создал компонент Vue/Vuefire для редактирования существующего виджета и сохранения изменений в 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;
    });
  }
}