反应选择：未捕获的类型错误：无法读取 null 的属性“offsetTop”答案

【问题标题】：React-select: Uncaught TypeError: Cannot read property 'offsetTop' of null反应选择：未捕获的类型错误：无法读取 null 的属性“offsetTop”
【发布时间】：2018-04-11 09:55:19
【问题描述】：

我已经创建了组件（工作 100% 完全），在将其移动到新目录后，单击 react-select 中的选择组件（应该列出所有选项，但崩溃）后，我得到：

manage-pois.js?v=1523440002:34563 Uncaught TypeError: Cannot read property 'offsetTop' of null
    at Select.componentDidUpdate (manage-pois.js?v=1523440002:34563)
    at commitLifeCycles (manage-pois.js?v=1523440002:16708)
    at commitAllLifeCycles (manage-pois.js?v=1523440002:17876)
    at HTMLUnknownElement.callCallback (manage-pois.js?v=1523440002:8472)
    at Object.invokeGuardedCallbackDev (manage-pois.js?v=1523440002:8511)
    at invokeGuardedCallback (manage-pois.js?v=1523440002:8368)
    at commitRoot (manage-pois.js?v=1523440002:17980)
    at performWorkOnRoot (manage-pois.js?v=1523440002:18947)
    at performWork (manage-pois.js?v=1523440002:18897)
    at batchedUpdates (manage-pois.js?v=1523440002:19016)

这是我渲染选择字段的代码：

 renderSelectCountry() {
        const {countries} = this.state;
        let options = countries ? countries.map((country) => {
            return {value: country.id, label: country.title};
        }) : [];
        return <Select
            value={this.state.countryId}
            placeholder='Country*'
            onChange={(e) => {
                this.setState({countryId: e ? e.value : ''})
            }}
            options={options}
            style={{marginBottom: '0px'}}
        />
    }

【问题讨论】：

renderSelectCountry 方法不包含代码中断的点。似乎在代码的某些部分中，您试图获取 DOM 中仍然不存在的元素的 offsetTop。

标签： javascript reactjs

【解决方案1】：

<Select> 组件尝试从表示所选选项的 DOM 元素中获取 offsetTop 属性。似乎由于某种原因，该选项没有安装 DOM 节点。

我用你的代码创建了一个minimal codesandbox example，它似乎可以工作。

问题可能不在您提供的代码中。

【讨论】：