在单独的js文件中定义默认道具

时间:2019-09-12 04:30:52

标签: reactjs react-props

我想在一个单独的js文件而不是主要js中定义默认道具。 现在,它在functionalComponent.js文件中定义 functionalComponent.defaultProps = {   数量:0   maxLimit:5   minLimit:0 };

我想在单独的文件中定义它,并在我的functionalComponent.js中使用它

1 个答案:

答案 0 :(得分:0)

创建一个单独的js文件,在其中定义默认道具作为对象并导出它们。 将相同的文件导入您的functionalComponent.js,提取并分配给默认道具。

App.js
----------
import React from "react";
import "./App.css";
import defaultProps from "./common/defaultProps";

function App(props) {
    return (
        <div className="App">
            <header className="App-header">Count {props.count}</header>
        </div>
    );
}
App.defaultProps = defaultProps["App"];
export default App;

defaultProps.js
------------------
const defaultProps = {
    App: { count: 0 }
};

export default defaultProps;