Reactjs 电影预告片npm不是'；在我的netflix克隆项目中无法正常工作

我已经使用React.js、firebase制作了一个netflix克隆，并将tmdbapi用于电影数据库。 我还使用了react youtube和电影预告片npm。 所以它有一个特点，每次我点击任何电影海报，它的预告片都必须播放。 但在大多数电影中，预告片并没有出现

这就是我面临的错误- 电影预告片：未找到具有当前搜索条件的TMDB电影，请尝试搜索 TypeError:构造“URL”失败：无效的URL 第三排，js:37

''

我正在分享我的github repo和已部署网站的链接，以供参考-

github-

网站-

行组件代码-

import React, { useState, useEffect } from "react";
import YouTube from "react-youtube";
import axios from "./axios";
import "./Row.css";
import movieTrailer from "movie-trailer"

const base_url = "https://image.tmdb.org/t/p/original/";

function Row({ title, fetchURL, isLargeRow }) {
  const [movies, setMovies] = useState([]);
  const [trailerURL, setTrailerURL] = useState("");

  useEffect(() => {
    async function fetchData() {
      const request = await axios.get(fetchURL);
      console.log(request.data.results);
      setMovies(request.data.results);
      return request;
    }
    fetchData();
  }, [fetchURL]);

  const opts = {
    height: "390",
    width: "100%",
    playerVars: {
      autoplay: 1,
    },
  };

  const handleClick = (movie) => {
    if (trailerURL) {
      setTrailerURL("");
    } else {
      movieTrailer(movie?.name || movie?.title || movie?.original_title || "")
        .then((url) => {
          const urlParams = new URLSearchParams(new URL(url).search);
          setTrailerURL(urlParams.get("v"));
        })
        .catch((error) => console.log(error));
    }
  };

  return (
    <div className='row'>
      <h2>{title}</h2>
      <div className='row__posters'>
        {movies.map((movie) => (
          <img
            key={movie.id}
            onClick={() => handleClick(movie)}
            className={`row__poster ${isLargeRow && "row__posterLarge"}`}
            src={`${base_url}${
              isLargeRow ? movie.poster_path : movie.backdrop_path
            }`}
            alt={movie.name}
          />
        ))}
      </div>
      {trailerURL && <YouTube videoId={trailerURL} opts={opts} />}
    </div>
  );
}

export default Row;

import React，{useState，useffect}来自“React”；
从“react YouTube”导入YouTube；
从“/axios”导入axios；
导入“/Row.css”；
从“电影预告片”导入movieTrailer
const base_url=”https://image.tmdb.org/t/p/original/";
函数行（{title，fetchURL，isLargeRow}）{
const[movies，setMovies]=useState（[]）；
const[trailerURL，setTrailerURL]=useState（“”）；
useffect（（）=>{
异步函数fetchData（）{
const request=wait axios.get（fetchURL）；
日志（请求、数据、结果）；
setMovies（请求、数据、结果）；
返回请求；
}
fetchData（）；
}，[fetchURL]）；
常量选项={
高度：“390”，
宽度：“100%”，
playerVars：{
自动播放：1，
},
};
const handleClick=（电影）=>{
if（trailerURL）{
setTrailerURL（“”）；
}否则{
movieTrailer（电影？.name | | |电影？.title | |电影？.original | | |？“”）
。然后（（url）=>{
const-urlParams=新的URLSearchParams（新的URL（URL）.search）；
setTrailerURL（urlParams.get（“v”））；
})
.catch（（错误）=>console.log（错误））；
}
};
返回(
{title}
{movies.map（（movie）=>(
))}
{trailerURL&&}
);
}
导出默认行；

看起来您可能受到费率限制。是否按中的费率？什么样的？