使用AnyApi与React

Question

我试图在我的react应用程序中使用AnyApi。

请求参数是IMDBid:string需要电影的IMDBid才能返回

获取https://hydramovies.com/api-v2/%3Fsource=http:/hydramovies.com/api-v2/current-Movie-Data.csv&imdb_id={IMDBid}

我希望能够键入输入框并从容器中的api返回搜索。我没有得到阿皮的任何回应，有人能帮忙吗？

// importing useState so we can create states 
import React, {useState, useEffect} from 'react';
// Imports style sheet for APP
import './App.css'; 

function App() {

  // setting imdbID so we can use this as a value in the input box
  const [imdbID,setimdbIDs] = useState('')

  const [container,setContainer] = useState([])
  useEffect(() =>{
    fetchMe()
  },[imdbID])

  const fetchMe = () => {

  fetch(`https://hydramovies.com/api-v2/%3Fsource=http:/hydramovies.com/api-v2/current-Movie-Data.csv&imdb_id={IMDBid}`, {
    "method": "GET"
})
.then(response => {
    return response.json();
})
.then(data => {
  setContainer(data.d)
})
.catch(err => {
    console.error(err);
});
  }

//Every letter that is typed in the input box will then change imdbID to setimdbIDs
const onChangeHandler = (e) => {
  setimdbIDs(e.target.value)
}

const submitHandler = e => {
  e.preventDefault()
}


  return (
    <div className="App"> 

      <form onSubmit={submitHandler}>

        {/* input box value is imdbID calling onChangeHandler state*/}
        <input type="text" value={imdbID} onChange={onChangeHandler}/>  
        {/* submit button */}
        <button type="submite">SUBMIT</button>

      </form>

      {container.map((item) =>{
        return (
          <p>{item.l}</p>
        )
      })}
      
    </div>
  );
}

export default App;

Answer 1

您没有正确地在url中提供IMDBid

模板文字应该像`string${expression}`一样给出

所以您的代码将是https://hydramovies.com/api-v2/%3Fsource=http:/hydramovies.com/api-v2/current-Movie-Data.csv&imdb_id=${IMDBid}