首页 > 解决方案 > 给出错误元素类型无效的所有范围滑块库。我还能尝试什么?

问题描述

我想在我的项目中创建一个滑块,我正在使用 react-rangeslider 库。我写了一篇很简单的文章


const Slider = require('react-rangeslider');
var Para = React.createClass({
handleChange: function(value) {
        this.setState({
            value: value,
        });
    },
    render: function () {

        return (
            <Slider
        value={this.state.value}
        orientation="vertical"
        onChange={this.handleChange} />
        );
    }
});

这导致错误

app.js:6873 Uncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of `Para`.

版本"react-rangeslider": "^2.2.0" 我尝试过的其他库是 mdbReact、ReactBootstrapSlider。

我确实看到了类似错误的帖子,但所有这些帖子都以不同的方式导入。

标签: reactjssliderrangeslidermdbreact

解决方案


当您错误地导入组件时会发生此错误。

如果您使用默认导出:

// yourfile.js
const Component;
export default Component;
// anotherFile.js
import yourComponent form './yourfile';

如果您使用命名导出:

// yourfile.js
export const Component;
// anotherFile.js
import { Component } form './yourfile';

推荐阅读