Невозможно обновить существующий документ в Firebase, используя VUE - PullRequest
1 голос
/ 24 января 2020

Я никогда не использовал Firebase до того, как это мой первый удар по нему с использованием Vue.

У меня есть настройка Firebase с использованием Realtime Databas и я настроил свой проект, чтобы я мог публиковать с использованием приведенного ниже кода в моем . vue file

this.$http.post('https://MY_PROJECT_NAME.firebaseio.com/posts.json', {
                title: this.blog.title,
                body: this.blog.content,
                createdDate: this.$options.filters.fullMthDate(this.blog.publishDate),
                author: this.blog.author,
                active: true,
                closedDate: null,                
            }).then((response) => {
                this.$blogAdded = true;
                this.loading = false;
                this.$router.push('/');                
            }).catch((error) => {
                console.log(error);
            });

enter image description here

Мне кажется, что я не могу найти ответ, как затем обновить этот документ при необходимости (например, пользователь удаляет элемент, я хочу, чтобы «active» стал false)

Я использовал приведенный выше код, поскольку использовал net ниндзя, которые настраивают FireBase таким образом.

Затем я делаю get, чтобы перечислить все элементы, используя ниже, в моем главном компоненте

this.$http.get('https://MY_PROJECT_NAME.firebaseio.com/posts.json').then(function(data) {
                return data.json();
            }).then(function(data) {
                var blogsArray = [];

                for (let key in data) {
                     const date = new Date(data[key].createdDate);
                     const todaysDate = new Date();

                    if (date <= todaysDate) {
                        data[key].id = key

                        blogsArray.push(data[key])
                    }
                }

                this.blogs = blogsArray;
                this.loading = false;
            });

И это отобразит их на моем сайте

enter image description here

Когда пользователь щелкает плитку, он go переходит на страницу, где он может «удалить / отменить» публикацию, и я здесь застрял. Ниже приведен код, который я использую для отображения выбранного элемента

data() {
        return {
            id: this.$route.params.id,
            blog: {},
            loading: false,
            closeModal: false,
            showModal: false
        };
    },

    beforeMount() {
        this.loading = true;            
    },

    created() {
        this.$http.get('https://MY_PROJECT_NAME.firebaseio.com/posts/' + this.id + '.json').then(function(data) {            
            return data.json();
        }).then(function(data) {
            this.blog = data;
            this.loading = false;
        });
    },

    methods: {
        showCloseBlogModal() {
            console.log(this.blog)
            VueEvent.$emit('show-delete-blog-modal', this.blog);
        }
    }

Затем, когда отображается модальный режим, я получаю следующее в console.log

enter image description here enter image description here

Мне нужно обновить «активное» значение до false, когда они нажимают «Да», используя приведенные ниже

methods: {
    deleteBlog() {
        // CODE HERE WHEN CLICK 'YES' TO CANCEL
    }
}
...