我想做一个api调用，只返回给定某个表字段的唯一结果到我的react前端

ryevplcw 于 2021-07-29 发布在 Java

关注(0)|答案(2)|浏览(223)

我正试图建立一个网上鞋店使用 flask 作为我的后端和React作为我的前端。我在react应用程序中对flask后端进行api调用，flask后端返回我的shoes表中的所有数据。该表包括品牌、尺寸、价格、颜色、型号等要素。
我可以使用useffect从表中检索所有数据：

function App() {

  // const { loading, data, error } = useQuery(); 
  const [shoes, setShoes] = useState([]);

  useEffect(() => {
    fetch('/shoes').then(response => 
      response.json().then(data => {
        setShoes(data.shoes);
      })
      );
  }, []);

  return (
    <div className="section">
        <h1 class="title">HI</h1>
        <Shoes shoes={shoes}/>
    </div>
  );
}

export default App;

我也想这样做，但只为独特的模型结果，如如果我有多个鞋的同一型号，只返回一次。有办法吗？

sql Api flask reactjs

来源：https://stackoverflow.com/questions/62316064/i-want-to-make-an-api-call-that-only-returns-unique-results-given-a-certain-tabl

2条答案

按热度按时间

os8fio9y1#

您需要从响应中删除重复项。你可以使用javascript Map 此的构造函数。

useEffect(() => {
    fetch('/shoes').then((response) =>
      response.json().then((data) => {
        const uniqueData = [...new Map(yourArray.map(item => [item['model'], item])).values()]
        console.log('uniqueData', uniqueData)
        setShoes(uniqueData)
      })
    )
  }, [])

在上面的代码中，内部Map将返回一个包含2个项的数组数组。第一项是关键，第二项是整个对象。
与 new Map... ，它将返回一个带有键值对的对象。 .values() 只会给出你想要的值。

赞(0）回复(0）举报 2021-07-29

wsxa1bj12#

我将flaskapi查询改为一个不同的调用，而不是返回所有的shoes，从而解决了这个问题。

赞(0）回复(0）举报 2021-07-29