按README文档使用，Add Inspector React Component部分似乎有点问题

[KeyToLove]

README中创建 Add Inspector React Component 这一步按照示例会报错

import React from 'react'
import { Inspector, InspectParams } from 'react-dev-inspector'

const isDev = process.env.NODE_ENV === 'development'

export const Layout = () => {
  // ...

  return (
    <>
      <YourComponent />

      {isDev && (
        <Inspector
          // props see docs:
          // https://github.com/zthxxx/react-dev-inspector#inspector-component-props
          keys={['control', 'shift', 'command', 'c']}
          onHoverElement={(inspect: InspectParams) => {}}
          onClickElement={(inspect: InspectParams) => {}}
        >
      )}
    </>
  )
}

通过以下方式使用时正常的

const WrapperComponent =
  process.env.NODE_ENV === 'development' ? Inspector : Fragment

function App() {
  return (
    <div className="App">
      <WrapperComponent keys={["control", "shift", "alt", "f"]}>
         <YourComponent />
      </WrapperComponent>
    </div>
  )
}

这块是文档上的错误，还是我的使用方式哪里错了呢 :(

[SyMind]

@KeyToLove 这是 bug，Inspector 的 children 为 undefined 导致的，目前你可以通过在 组件下添加一个空 React 组件解决这个问题：

<Inspector>
+    <></>
</Inspector>

[SyMind]

@zthxxx 我看到代码中已经解决了这个问题，但最新的 npm 中并没有同步最新的代码。

https://github.com/zthxxx/react-dev-inspector/blob/master/src/Inspector/Inspector.tsx#L156

[KeyToLove]

Thanks~ 这个 issue 我认为可以暂时留着，遇到相同问题的可以进行参照来使用，待文档或 npm 包更新再关闭。

[zthxxx]

是的，代码早就更新了，只是 v1.6.8 终于想起来发版了 🌝