Question

请问，如何以其他方式重写此代码以避免下面的错误？

     render() {
            const { children, ...props } = this.props;
            return <div {...props} ref={this.setRef}>{children}</div>
      }

我收到此错误：

标记上的未知道具onClickOutside。从元素中删除此prop。有关详细信息（https://facebook.github.io/react/docs/higher-order-components.html#static-methods-must-be-copied-over）

Answer 1

原生DOM元素只允许具有Native DOM属性。你不能传递你想要的任何属性（道具）如果你知道这个元素需要什么样的有效道具，你可以用道具破坏它们并明确地传递它们例如：

 render() {
            const { children, onClickOutside } = this.props;
            return <div onClick={onClickOutside} ref={this.setRef}>{children}</div>
      }

Answer 2

您只需从转移的...props中删除：

render() {
            const { children, onClickOutside, ...props } = this.props;
            return <div {...props} ref={this.setRef}>{children}</div>
      }

如果您希望onClickOutside映射到onClick的{{1}}，请明确处理：

div

任何版本的React＆lt; 16.x，具有可用属性的白名单。因此，传递给元素的所有属性都必须在白名单中。

如何避免错误＆＃34; Unknown prop＆lt;＆gt;在标签上。从元素中移除此道具＆＃34;？

2 个答案: