我目前正在尝试将我的 firestore 数据库中文档的值更新为 1。搜索一段时间后,我发现了 FieldValue.increment(1)。我的目标是拥有一个包含 2 个字段(主持人/侦察员)的表单,我将在这些字段上输入需要增加主持人或侦察员值(value)的人的姓名。这是我的 vue 组件的样子
<template>
<div class="add-wave">
<h3>Add Wave</h3>
<div class="row">
<form @click.prevent="addwave()" class="col s12">
<div class="row">
<div class="input-field col s12">
<input type="text" v-model="host" />
<label class="active">Host</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input type="text" v-model="scout" />
<label class="active">Scout</label>
</div>
</div>
<button type="submit" class="btn">Submit</button>
<router-link to="/member" class="btn grey">Cancel</router-link>
</form>
</div>
</div>
</template>
<script>
import db from "../data/firebaseInit";
export default {
data() {
return {
host: null,
scout: null
};
},
methods: {
addwave() {
db.collection("members")
.where("name", "==", this.$route.params.host)
.get()
.then(querySnapshot => {
querySnapshot.forEach(doc => {
doc.ref
.update({
host: db.FieldValue.increment(1)
})
.then(() => {
this.$router.push({
name: "member",
params: { name: this.name }
});
});
});
});
}
}
};
</script>
一切都可以编译,但是每当我尝试在每个输入字段中输入一个名称时,我都会收到错误消息“FirebaseError:“Function Query.where() 需要一个有效的第三个参数,但它是未定义的。”
我不知道为什么会收到此错误或如何修复它。谁能指出我正确的方向?
最佳答案
目前的代码至少存在两个问题:
this.$route.params.host
应该是this.host
,因为这是 Vue 将绑定(bind)主机参数的地方。这是对您最初问题的直接回答。假设
db
从firebase.firestore()
创建, 它不是引用静态FieldValue
的有效方式对于increment
功能。您需要直接将其获取为firebase.firestore.FieldValue
.您需要以某种方式将此符号导入您的代码,因为现在firebase
无法访问,因为它仅存在于firebaseInit
中模块。
执行此导入的一种方法是将其添加到 <script>
的顶部部分(另一个答案中记录了另一种方式):
import firebase from "firebase/app";
另请注意,鉴于每个文档的更新速率限制为每秒 1 次更新,计数器最终可能无法缩放。 firebase 文档有一个 solution了解一旦超出此解决方案,如何构建分布在多个文档中的计数器。无论如何,这也表明正确使用了 increment
一般。
关于javascript - 在 Vue App 上使用 FieldValue 增加 Firestore 的值(value),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58735725/