Question

我目前正在尝试将碎片仪表板集成到我的react应用程序中。一切工作都很好，除了search-navbar的缩放比例太大。控制台给我以下错误：“警告：道具类型失败：在NavLink中（在SidebarNavItem.js：8）提供给tag的道具NavLink无效。”。提到的文件如下所示：

import React from "react";
import PropTypes from "prop-types";
import { NavLink as RouteNavLink } from "react-router-dom";
import { NavItem, NavLink } from "shards-react";

const SidebarNavItem = ({ item }) => (
  <NavItem>
    <NavLink tag={RouteNavLink} to={item.to}>
      {item.htmlBefore && (
        <div
          className="d-inline-block item-icon-wrapper"
          dangerouslySetInnerHTML={{ __html: item.htmlBefore }}
        />
      )}
      {item.title && <span>{item.title}</span>}
      {item.htmlAfter && (
        <div
          className="d-inline-block item-icon-wrapper"
          dangerouslySetInnerHTML={{ __html: item.htmlAfter }}
        />
      )}
    </NavLink>
  </NavItem>
);

SidebarNavItem.propTypes = {
  /**
   * The item object.
   */
  item: PropTypes.object
};

export default SidebarNavItem;

我已经在Google上进行了很多搜索，但是我发现的所有相关错误都是由某些组件引起的，这些组件不是我的代码的一部分。我希望有人能帮助我。：）

Answer 1

我遇到了完全相同的问题，使用相同的框架。

问题是这一行：

import { NavLink as RouteNavLink } from "react-router-dom";

似乎这种导入语法将 Component（函数）转换为引用，这就是您在登录控制台时获得 Object 的原因。然后 tag 属性输入错误。

解决问题的基本解决方法：

<NavLink tag={(props) => <RouteNavLink {...props} />} to={item.to}>

Answer 2

您的问题是它期望document.getElementById('loading').style.background = "transparent";，但是您得到的是Func | String，因此您需要弄清楚类型错误的原因

警告：道具类型失败：提供给“ NavLink”的道具“标签”无效

2 个答案: