小编Alf*_*red的帖子

如果我转到“ 当我检查控制台时”，一旦我未定义，然后是正确的 ID（在本例中为 5），pages/user/[id].jsx 我的[id].jsx 包含中就有一条动态路由。这是怎么回事，有办法解决吗？console.log(useRouter().query.id);url/user/5

我有一个状态，根据它是真还是假，我会显示不同的 svg 图标，尽管我注意到状态之间的切换导致出现此错误：警告：反应检测遇到错误：错误：找不到光纤“SvgCheck”的 ID ，我在 public/static/icons 中有我的图标，所有 svg 文件都在这里，然后我有 index.js，我在其中导入这些图标，然后像这样导出

import Check from './check.svg'
export {
...
Check,
}

然后我将它们导入为：

import {Check} from "public/static/icons"

我用它们作为 <Check/>

为了让我像这样使用它，我在 next.config.js 中使用了 svgr 插件，我有：

module.exports = {
    webpack(config) {
      config.module.rules.push({
        test: /\.svg$/,
        use: ["@svgr/webpack"]
      });
  
      return config;
    }
  };

我最近才开始收到这个警告，以前从未见过。

我创建了一个自定义的可搜索下拉列表，当我专注于输入时，我会显示该下拉列表，如果我单击其他地方，则通过设置使用 onBlur() 管理该下拉列表的状态来隐藏该下拉列表。问题是当我单击下拉元素以选择一个选项时，在触发事件之前关闭下拉列表，我在 setShowDropdown 设置为 false 之前添加了 100 毫秒的超时，但我不太满意，我想知道什么是更好的方法？

  const [selected, setSelected] = useState("");
  const [searchValue, setSearchValue] = useState("");
  const [showDropdown, setShowDropdown] = useState(false);

下拉元素：

 <li
          key={el}
          className={clsx(
            "custom-select__dropdown-item p-3 cursor-pointer flex justify-between hover:bg-fmc-blue-2 hover:text-white duration-300",
            selected === el ? "bg-fmc-blue-2 text-white" : "bg-white text-gray-500"
          )}
          onClick={() => {
          
            setSelected(el);
            setSearchValue("");
           
          }}
        >
          {el}
          <ChevronRight className="ml-2 text-fmc-blue-2" />
        </li>

我设置是否显示下拉列表的输入：

  <input
              type="text"
              onChange={(e) => setSearchValue(e.target.value.trim())}
              className="w-full mr-3 border-none h-full outline-none"
              placeholder={placeholder}
              onFocus={setShowDropdown.bind(null, true)}
              onBlur={() =>
                setTimeout(() => {
                  setShowDropdown(false);
                }, …