如何在reactjs中导入_Reactjs_Import

如何在reactjs中导入

reactjs import

如何在reactjs中导入,reactjs,import,Reactjs,Import,我正在尝试在以下代码中导入“react dropdowns datepicker”和“react”，但它不起作用： <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react-

我正在尝试在以下代码中导入“react dropdowns datepicker”和“react”，但它不起作用：

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react-dom.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.js"></script>
</head>

import React from 'react';
import DatePicker from'react-dropdowns-datepicker';

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>


从“React”导入React；
从“react-dropdowns-DatePicker”导入日期选择器；
类Main扩展了React.Component{
render（）{return（asdf）}
}
ReactDOM.render(
,
document.getElementById（'root'））
);

正确的方法是什么？谢谢

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

PS：我尝试了你提到的改变

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

我试过这个：

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>


类Main扩展了React.Component{
render（）{return（asdf）}
}
ReactDOM.render(
,
document.getElementById（'root'））
);

以下是错误：

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

react-datepicker.js:4850 Uncaught TypeError: (0 , _reactOnclickoutside2.default) is not a function
    at Object.<anonymous> (react-datepicker.js:4850)
    at __webpack_require__ (react-datepicker.js:30)
    at Object.<anonymous> (react-datepicker.js:648)
    at __webpack_require__ (react-datepicker.js:30)
    at Object.<anonymous> (react-datepicker.js:63)
    at __webpack_require__ (react-datepicker.js:30)
    at react-datepicker.js:50
    at react-datepicker.js:53
    at webpackUniversalModuleDefinition (react-datepicker.js:9)
    at react-datepicker.js:10
(anonymous) @ react-datepicker.js:4850
__webpack_require__ @ react-datepicker.js:30
(anonymous) @ react-datepicker.js:648
__webpack_require__ @ react-datepicker.js:30
(anonymous) @ react-datepicker.js:63
__webpack_require__ @ react-datepicker.js:30
(anonymous) @ react-datepicker.js:50
(anonymous) @ react-datepicker.js:53
webpackUniversalModuleDefinition @ react-datepicker.js:9
(anonymous) @ react-datepicker.js:10

react datepicker.js:4850未捕获类型错误：（0，\u reactionclickoutside 2.default）不是函数
反对。（react datepicker.js:4850）
在网页上需要（react datepicker.js:30）
反对。（react datepicker.js:648）
在网页上需要（react datepicker.js:30）
反对。（react datepicker.js:63）
在网页上需要（react datepicker.js:30）
在react datepicker.js:50
在react datepicker.js:53
在webpackUniversalModuleDefinition（react datepicker.js:9）上
在react datepicker.js:10
（匿名）@react datepicker.js:4850
__webpack_require@react datepicker.js:30
（匿名）@react datepicker.js:648
__webpack_require@react datepicker.js:30
（匿名）@react datepicker.js:63
__webpack_require@react datepicker.js:30
（匿名）@react datepicker.js:50
（匿名）@react datepicker.js:53
webpackUniversalModuleDefinition@react datepicker.js:9
（匿名）@react datepicker.js:10

感谢您的帮助

如果您已设置为使用

反应下拉列表日期选择器

，请使用以下链接：

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<script src="https://unpkg.com/react-onclickoutside@5.7.1/index.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-datepicker/0.37.0/react-datepicker.js"></script>

请查看一个示例

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

请注意，这里的顺序很重要，因为这三者相互依赖

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

最后，您的代码应该如下所示：

<body>
<div id="root"></div>
<script type="text/babel">

class Main extends React.Component{
    render() {return (<div>asdf</div>)}
}

ReactDOM.render(
    <Main/>,
    document.getElementById('root')
);

</script>
</body>

<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js></script>
<script src="https://unpkg.com/react-onclickoutside@5.7.1/index.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-datepicker/0.37.0/react-datepicker.js"></script>

</head>

<body>
<div id="root"></div>
<script type="text/babel">

<!-- ... the rest of your code continues on here ...-->


抱歉，刚刚看到你的更新。将来，你可以使用@符号发送通知，并在评论中提及我的名字。你看过我下面提到的代码笔了吗？上面有一个工作日期选择器并使用React:）