小编Joh*_*cks的帖子

伙计，我遇到了问题。我有一个二维数据。数据具有包含链接的嵌套结构。

const data = [
  // First Div Panel 
  [
    {
      id: 1,
      url: "/services",
      title: "Services"
    },
    {
      id: 2,
      title: "Products",
      children: [
        {
          id: 3,
          url: "/themes-templates",
          title: "Themes & Templates"
        },
        {
          id: 4,
          url: "/open-source",
          title: "Open Source"
        },
        {
          id: 5,
          url: "/solutions",
          title: "Solutions"
        }
      ]
    },
    {
      id: 6,
      url: "/work",
      title: "Work",
      children: [
        {
          id: 7,
          url: "/methodology",
          title: "Methodology",
          children: [
            {
              id: 8,
              url: "/agile",
              title: "Agile",
              children: …

伙计们，我在react-slick滑块方面遇到了问题。我在滑块上渲染卡片取决于数组长度。我还渲染自定义next和previous按钮，触发next和previous功能来更改幻灯片。我也想让这个滑块响应。这意味着它具有根据定义的设置滚动幻灯片的功能。

我为断点定义的设置：

992 > 幻灯片滚动 = 3

577 - 991 幻灯片滚动 = 2

0 - 576 幻灯片滚动 = 1

next没有向前滑动时该按钮将被禁用，当没有后向滑动时该previous按钮将被禁用。为了实现此功能，有一个名为 afterChange 的函数可返回幻灯片的当前活动索引。所以我在state. 但我认为我的next按钮逻辑不正确。

我的问题是什么？

• refresh调整窗口大小时是否有任何方法可以调整滑块，因为幻灯片没有根据breakpoints?

• 即使前面没有幻灯片，该next按钮也不会在断点处禁用(0 - 576)。

• 当用户更改单张幻灯片然后调整窗口大小以移动到下一张幻灯片时，该Next按钮将变为非活动状态。

我认为问题在于我写在renderArrows函数内部的逻辑。

看到这个：

代码沙盒：查看此

代码：

import React, { useState, useRef } from "react";
import Slider from "react-slick";

// Constant Variables
// …

我创建了一个API端点，当用户尝试搜索时返回产品标题。现在在前端，当在输入字段上输入一些按键时，我将对该端点进行 API 调用。所以我将该组件编写React为基于类的组件。它工作正常。但是现在我想React通过使用React钩子在较新版本中转换该组件。

我的基于类的实现工作正常。我所做的是当用户输入一些按键时。我debounce即延迟作为参数传递的函数的执行。该函数handleSearchChange()从字段中获取值并检查value字符串是否大于 1 个字符，然后在指定的延迟后进行 API 调用，作为响应返回一些结果。

服务器从以下数据中过滤结果：

[
  {
    "title": "Cummings - Nikolaus",
    "description": "Assimilated encompassing hierarchy",
    "image": "https://s3.amazonaws.com/uifaces/faces/twitter/michalhron/128.jpg",
    "price": "$20.43"
  },
  {
    "title": "Batz, Kiehn and Schneider",
    "description": "Public-key zero tolerance portal",
    "image": "https://s3.amazonaws.com/uifaces/faces/twitter/attacks/128.jpg",
    "price": "$58.97"
  },
  {
    "title": "Borer, Bartell and Weber",
    "description": "Programmable motivating system engine",
    "image": "https://s3.amazonaws.com/uifaces/faces/twitter/craighenneberry/128.jpg",
    "price": "$54.51"
  },
  {
    "title": "Brekke, Mraz and Wyman",
    "description": "Enhanced …

我面临前端代码库的问题Reactjs。我们使用库名称react-autoauggest来实现自动完成功能，但lead决定从react-autoauggest转向downshift。我通读了该文档并使用钩子实现了这一点useCombobox，但他提出了一些问题并告诉我在没有任何指导的情况下解决这些问题。我创建了这些问题的干净版本。

首先，我正在解决issue-4 清除按钮应该清除输入字段并关闭菜单的问题。但是当我单击清除按钮时，输入字段为空，但菜单仍然打开。您能给我一些关于如何在降档时做这些事情的指导吗？

这是我的codesandbox链接，从对象数组中过滤数据： 在此处查看代码沙箱

应用程序.js：

const App = () => {

    // Array of objects
    const [inputItems, setInputItems] = useState(data);

    // State for all primitive types
    const [value, setValue] = useState('');


    /**
     * It will returns the new filtered array.
     * @param data Array<Object> - The array to iterate over
     * @param inputValue {string} - Your input value
     * @return Array<Object> - Returns the …