【文件属性】:
文件名称:react-if:ally有条件地渲染React组件
文件大小:297KB
文件格式:ZIP
更新时间:2021-04-01 13:33:25
react TypeScript
如果有React
有条件地渲染React组件。
该组件有什么作用
看一下以下演示组件,其中包含用于条件渲染的常用模式:
const Bar = ( { name , age , drinkingAge } ) => (
< div>
< Header>
{ age >= drinkingAge ? < span xss=removed> Have a beer, { name } ! < / span > : < span xss=removed> Sorry, { name } , you are not old enough. < / span > }
< Footer>
< / div >
) ;
使用React-If您可以将其重写为更具可读性和表达性的格式:
const Bar = ( { nam
【文件预览】:
react-if-master
----.gitignore(479B)
----.all-contributorsrc(5KB)
----.eslintrc(3KB)
----package.json(3KB)
----src()
--------When.tsx(785B)
--------If.tsx(1KB)
--------getConditionResults.ts(434B)
--------Then.tsx(307B)
--------tsconfig.json(131B)
--------render.tsx(396B)
--------tinyWarning.ts(938B)
--------Else.tsx(307B)
--------Unless.tsx(790B)
--------Switch.tsx(2KB)
--------Case.tsx(468B)
--------Augments.d.ts(151B)
--------Default.tsx(393B)
--------index.tsx(222B)
--------types.ts(525B)
----LICENSE.md(1KB)
----jest.config.js(326B)
----tsconfig.eslint.json(205B)
----CHANGELOG.md(3KB)
----.github()
--------husky()
--------CODEOWNERS(20B)
--------problemMatchers()
--------CONTRIBUTING.md(566B)
--------workflows()
----.prettierrc.js(97B)
----README.md(14KB)
----demo()
--------.gitignore(24B)
--------components()
--------package.json(593B)
--------tsconfig.json(559B)
--------README.md(378B)
--------index.html(808B)
--------index.tsx(481B)
--------yarn.lock(229KB)
----.eslintignore(67B)
----typedoc.json(173B)
----tsconfig.base.json(172B)
----test()
--------If.test.tsx(10KB)
--------tsconfig.json(172B)
--------Switch.test.tsx(6KB)
--------Unless.test.tsx(2KB)
--------jest.setup.ts(503B)
--------__snapshots__()
--------Then.test.tsx(587B)
--------When.test.tsx(2KB)
----.editorconfig(420B)
----yarn.lock(468KB)