30秒到達(dá)戰(zhàn)場(chǎng)
2022-06-09 10:37:35
嘗試使用 lambda 函數(shù)和 TSLint 將組件作為道具發(fā)送會(huì)引發(fā)異常。組件可以像這樣作為 prop 發(fā)送:<Test id={'XYZ-1809'} condn1={<Condn1Component />} condn2={<Condn2Component />}/>但是當(dāng)嘗試將其作為功能性道具發(fā)送時(shí),會(huì)引發(fā)錯(cuò)誤:Lambdas are forbidden in JSX attributes due to their rendering performance impact (jsx-no-lambda)tslint(1)<Test id={'XYZ-1809'} condn1={() => <Condn1Component />} condn2={() => <Condn2Component />}/>Condn1Component并且Condn2Component可以是不確定的功能或類組件。擺脫 JSX-Lambda 問(wèn)題的最佳方法是什么?
1 回答

陪伴而非守候
TA貢獻(xiàn)1757條經(jīng)驗(yàn) 獲得超8個(gè)贊
我設(shè)法做到了如下:
const Condn1Component = () => {
return (<h1>I am condition1</h1>);
}
const Condn2Component = () => {
return (<h1>I am condition2</h1>);
}
const condn1ComponentHandler = () => {
return <Condn1Component />
}
const condn2ComponentHandler = () => {
return <Condn2Component />
}
<Test
id={'XYZ-1809'}
condn1={condn1ComponentHandler}
condn2={condn2ComponentHandler}
/>
并接受為:
this.props.condn1();
this.props.condn2();
添加回答
舉報(bào)
0/150
提交
取消