当使用arrayUnion将元素添加到firestore中的arrayField时，我得到TypeError defau

Question

我使用带有Firebase的ReactJs制作应用程序。在 updatePlayer 中，我完全按照 firebase 文档将元素添加到数组中。在Firestore中，我有一个名为footballgames的集合，其中包含一个名为C3j5hXxNFKMBUM7YxaNX的游戏文档。它包含一个数组字段，其中包含一个玩家数组，每当调用函数时，我想将"John"添加到数组中。但是我不断收到错误 类型错误：_firebase_firebase_utils__WEBPACK_IMPORTED_MODULE_5__.default.collection 不是函数

import React, { useState, useEffect, Fragment } from "react";
import { useParams } from "react-router-dom";
import { connect } from "react-redux";
import GameDetails from "../../components/game-details/game-details.component";
import PlayerList from "../../components/player-list/player-list.component";
import firestore from '../../firebase/firebase.utils'
import * as firebase from 'firebase';
import 'firebase/firestore';
class GameDetailPage extends React.Component {
constructor(props) {
super(props);
this.state = {
userName: "",
};
}

updatePlayers=()=>{
var playersRef=firestore.collection("footballgames").doc("C3j5hXxNFKMBUM7YxaNX")
playersRef.update({
Players:firebase.firestore.FieldValue.arrayUnion("John")
})
}

render() {
const { games, currentUser } = this.props;
let { linkUrl } = this.props.match.params;
const gameObj = games[linkUrl];
console.log("user", currentUser);

return (
<Fragment>
<div className="game-list">
<GameDetails game={gameObj} />
</div>
<h2>Current players</h2>
{currentUser ? (
<div className="player-list">
{gameObj.Players.map((player, index) => (
<PlayerList key={index} player={player} />
))}
</div>
) : (
<p>Loading</p>
)}
<button onClick={()=>this.updatePlayers()}>Join</button>
</Fragment>
);
}
}
const mapStateToProps = (state) => ({
games: state.games.games,
currentUser: state.user.currentUser,
});
export default connect(mapStateToProps)(GameDetailPage);

Answer 1

该错误似乎与arrayUnion无关。使用您在此处显示的内容，这似乎不起作用(找不到方法集合(：

var playersRef = firestore.collection(...)

您需要改用它来查找收集方法：

var playersRef = firebase.firestore.collection(...)

您的导入是拉入其他内容并将其称为firestore，它可能与firebase.firestore不同：

import firestore from '../../firebase/firebase.utils'