我想在一个或多个钩子组件中声明默认道具
通常我们会这样做
$split = explode(PHP_EOL." ".PHP_EOL." ", $string);
print_r($split);
这显然行不通
答案 0 :(得分:3)
function Body({counter=0}) {
return (
<div>
body
</div>
);
}
计数器现在的初始值为0
答案 1 :(得分:2)
通常称为功能组件,而不是挂钩组件。
对于defaultProps
,您可以这样操作:
const Body = () => {
return (
<div>
body
</div>
);
}
Body.defaultProps = {
counter: 0
}
答案 2 :(得分:2)
您可以这样简单地完成
const Body = (props) => {
const {foo = 'defaultValue'} = props;
return <div>{foo}</div> // It will show defaultValue if props foo is undefined
}
答案 3 :(得分:0)
钩子只是常规函数,您可以像在常规函数中定义缺省值一样定义缺省值
function useNameHook(initialName = "Asaf") {
const [name, setName] = useState(initialName);
// you can return here whatever you want, just the name,
// just the setter or both
return name;
}
function Comp({ name }) {
const myName = useNameHook(name);
return <h1>Hello {myName}</h1>;
}
function App() {
return (
<div className="App">
{/* without name prop */}
<Comp />
{/* with name prop */}
<Comp name="angry kiwi" />
</div>
);
}
答案 4 :(得分:0)
您可以在功能组件之外声明defaultProps。就您而言,就是这样-
function Body(props) {
return (
<div>
{props.counter}
</div>
);
}
Body.defaultProps = {
counter: 0
}