Я никогда не использовал 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);
});
Мне кажется, что я не могу найти ответ, как затем обновить этот документ при необходимости (например, пользователь удаляет элемент, я хочу, чтобы «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;
});
И это отобразит их на моем сайте
Когда пользователь щелкает плитку, он 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
Мне нужно обновить «активное» значение до false
, когда они нажимают «Да», используя приведенные ниже
methods: {
deleteBlog() {
// CODE HERE WHEN CLICK 'YES' TO CANCEL
}
}