'"arry-contains"' での エラー

Question

whereメソッドを使ったところ

Argument of type '"arry-contains"' is not assignable to parameter of type 'WhereFilterOp'

このようなエラーが出て
array-contains-any
に書き換えてみたり、

array-containsに関するGit

を参考にしてみたのですが、
解決しません、、

components/ResultPage/ResultImage.tsx


import React ,{FC, useState,useEffect} from 'react';
import  {useParams} from 'react-router-dom';
import firebase from '../../firebase'
import {FileData} from '../../types/Types'

const ImageItemList: FC =()=>{
  const [data, setData] = useState<FileData[]>([]);
  const {keyword} = useParams();
  const getData =async(searchWord: string | undefined)=>{
    const db = firebase.firestore();
    const fileDataRef = db.collection("fileData");
    const searchedData = fileDataRef.where("keyword", "array-contains-any" , searchWord);　**エラー部分**
    const snapShot = await searchedData.get();
    const temporaryData: object[] = [];

    snapShot.docs.map(doc =>{
      temporaryData.push(doc.data())
    })
    setData(temporaryData as FileData[]);
  }

useEffect(() =>{
  getData(keyword);
},[]);
  return (
    <div>
      
    </div>
  )
}
export default  ImageItemList

firebae.ts

import firebase from "firebase/app";
import "firebase/firestore";
import  "firebase/firebase-storage";

var firebaseConfig = {
  apiKey: "AIzaSyCkUItnJUMpMMVOtrrpwRSvCQf1GJ0lYuc",
  authDomain: "form-techpit.firebaseapp.com",
  databaseURL: "https://form-techpit.firebaseio.com",
  projectId: "form-techpit",
  storageBucket: "form-techpit.appspot.com",
  messagingSenderId: "169202913739",
  appId: "1:169202913739:web:4b34010c81aea9893f264e"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);

export default firebase;

Answer 1

好的，谢谢您，如果您遇到这样的问题，可以问我，我总是尽力而为。

MyMileStoneCard

Answer 2

The error message you're encountering is related to Firebase Firestore queries, specifically the use of array-contains-any. The issue is that you are using "array-contains" instead of "array-contains-any", which is causing a type error because TypeScript expects the correct WhereFilterOp.

Here's the corrected code with "array-contains-any":

import React, { FC, useState, useEffect } from 'react';
import { useParams } from 'react-router-dom';
import firebase from '../../firebase';
import { FileData } from '../../types/Types';

const ImageItemList: FC = () => {
const [data, setData] = useState<FileData[]>([]);
const { keyword } = useParams();

const getData = async (searchWord: string | undefined) => {
const db = firebase.firestore();
const fileDataRef = db.collection('fileData');
const searchedData = fileDataRef.where('keyword', 'array-contains-any', [searchWord]); // Use 'array-contains-any' here
const snapShot = await searchedData.get();
const temporaryData: object[] = [];

snapShot.docs.map((doc) => {
  temporaryData.push(doc.data());
});
setData(temporaryData as FileData[]);

};

useEffect(() => {
getData(keyword);
}, []);

return <div></div>;
};

export default ImageItemList;

In this code, I replaced "array-contains" with "array-contains-any" and also wrapped searchWord in an array because array-contains-any expects an array of values to check for.

With these changes, the error should be resolved, and your Firestore query should work as expected.

Answer 3

array-contains-anyにして、
yarn startしたら治りました,,,