github/javascript
1
1
Fork 0
mirror of https://github.com/airbnb/javascript.git synced 2026-01-13 22:38:08 -05:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1620 from lasota-piotr/classname-props

Browse Source 
[guide] [react] Added anti-pattern example for Props Naming rule, changed className props in examples
This commit is contained in:
Jordan Harband
2017-10-25 13:33:52 -07:00
committed by GitHub
parent dbdf8ea0ef 9d3e7e0a2c
commit 9edcdde8fe
1 changed files with 7 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
react/README.md
View File

@@ -143,6 +143,9 @@
// bad
<MyComponent style="fancy" />
// bad
<MyComponent className="fancy" />
// good
<MyComponent variant="fancy" />
```
@@ -400,7 +403,7 @@
```jsx
// bad
render() {
return <MyComponent className="long body" foo="bar">
return <MyComponent variant="long body" foo="bar">
<MyChild />
</MyComponent>;
}
@@ -408,7 +411,7 @@
// good
render() {
return (
<MyComponent className="long body" foo="bar">
<MyComponent variant="long body" foo="bar">
<MyChild />
</MyComponent>
);
@@ -427,10 +430,10 @@
```jsx
// bad
<Foo className="stuff"></Foo>
<Foo variant="stuff"></Foo>
// good
<Foo className="stuff" />
<Foo variant="stuff" />
```
- If your component has multi-line properties, close its tag on a new line. eslint: [`react/jsx-closing-bracket-location`](https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-closing-bracket-location.md)