How i can destructuring {this.props.children}?

Multi tool use
I want to add a background to my mobile app but when i use "this.props.children"
eslint say me "Must use destructuring props assignment". Why i can destructuring this props ?
This my code ,
export default class WallPaper extends Component {
render() {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
when i use this code
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
i have this error "'children' is missing in props validation"
when i use this code ,
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
i have this error,
thank you in advance for your help !
javascript node.js reactjs react-native destructuring
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
add a comment |
I want to add a background to my mobile app but when i use "this.props.children"
eslint say me "Must use destructuring props assignment". Why i can destructuring this props ?
This my code ,
export default class WallPaper extends Component {
render() {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
when i use this code
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
i have this error "'children' is missing in props validation"
when i use this code ,
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
i have this error,
thank you in advance for your help !
javascript node.js reactjs react-native destructuring
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
3
github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/… explains this rule better.
– apokryfos
Dec 27 '18 at 16:37
Also this is a linter rule so not technically an error so unless you're working in a team that is enforcing a specific rule set then you should modify the rules to ones you are most comfortable with working.
– apokryfos
Dec 27 '18 at 16:38
add a comment |
I want to add a background to my mobile app but when i use "this.props.children"
eslint say me "Must use destructuring props assignment". Why i can destructuring this props ?
This my code ,
export default class WallPaper extends Component {
render() {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
when i use this code
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
i have this error "'children' is missing in props validation"
when i use this code ,
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
i have this error,
thank you in advance for your help !
javascript node.js reactjs react-native destructuring
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
I want to add a background to my mobile app but when i use "this.props.children"
eslint say me "Must use destructuring props assignment". Why i can destructuring this props ?
This my code ,
export default class WallPaper extends Component {
render() {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
when i use this code
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
i have this error "'children' is missing in props validation"
when i use this code ,
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
i have this error,
thank you in advance for your help !
export default class WallPaper extends Component {
render() {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
export default class WallPaper extends Component {
render() {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
javascript node.js reactjs react-native destructuring
javascript node.js reactjs react-native destructuring
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
edited Dec 27 '18 at 16:53
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
asked Dec 27 '18 at 16:34


Michel Melhem
184
184
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
New contributor
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Michel Melhem is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
3
github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/… explains this rule better.
– apokryfos
Dec 27 '18 at 16:37
Also this is a linter rule so not technically an error so unless you're working in a team that is enforcing a specific rule set then you should modify the rules to ones you are most comfortable with working.
– apokryfos
Dec 27 '18 at 16:38
add a comment |
3
github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/… explains this rule better.
– apokryfos
Dec 27 '18 at 16:37
Also this is a linter rule so not technically an error so unless you're working in a team that is enforcing a specific rule set then you should modify the rules to ones you are most comfortable with working.
– apokryfos
Dec 27 '18 at 16:38
3
3
github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/… explains this rule better.
– apokryfos
Dec 27 '18 at 16:37
github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/… explains this rule better.
– apokryfos
Dec 27 '18 at 16:37
Also this is a linter rule so not technically an error so unless you're working in a team that is enforcing a specific rule set then you should modify the rules to ones you are most comfortable with working.
– apokryfos
Dec 27 '18 at 16:38
Also this is a linter rule so not technically an error so unless you're working in a team that is enforcing a specific rule set then you should modify the rules to ones you are most comfortable with working.
– apokryfos
Dec 27 '18 at 16:38
add a comment |
3 Answers
3
active
oldest
votes
You could try the following to destructure children
from this.props
:
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
It looks like your project may require propTypes for this component. Try the following to add a children
prop type. Note, you will need to install package prop-types:
// ...
import PropTypes from 'prop-types';
class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
WallPaper.propTypes = {
children: PropTypes.node // or PropTypes.node.isRequired to make it required
};
export default WallPaper;
Hopefully that helps!
I have already tried this method but I get the error "'children' is missing in props validation"
– Michel Melhem
Dec 27 '18 at 16:41
@MichelMelhemconst { children } = this.props;
would be exactly how you achieve destructuring. If you have PropTypes validations on componentWallPaper
, see this answer for an approach to children PropTypes validation. Try though first removing propTypes temporarily to see if the linting error via this destructuring assignment is resolved. If you continue to have issues after adding children to propTypes validation, share your propTypes code for additional support. Thanks!
– Alexander Staroselsky
Dec 27 '18 at 16:43
Does your project require that each component has propTypes? If so, go ahead and please add propTypes to this component.
– Alexander Staroselsky
Dec 27 '18 at 17:54
add a comment |
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
1
When i use you code i have an Parsing error: Unexpected token 15 | render() { 16 | props => ( > 17 | return ( | ^ 18 | <ImageBackground 19 | source={backgroundimg} 20 | imageStyle={{ opacity: 0.9 }}
– Michel Melhem
Dec 27 '18 at 16:48
sorry, try add this.props, i edit the post.
– Rafael Lucini
Dec 27 '18 at 16:50
add a comment |
This is due to linting rule.
You can turn off rule if you don't want destructing.
If you want than you can do it like this.
export default class WallPaper extends Component {
render() {
const {children} = this.props
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
oui je sais que je peux desactiver cette règle mais si cette règle existe c'est qu'il y a probablement une bonne raison
– Michel Melhem
Dec 27 '18 at 16:58
@MichelMelhem what ?? can you write in English ? can't understand what you have written ?
– Code Maniac
Dec 27 '18 at 17:01
excuse me it was a fail this is the message: yes i know i can disable this rule but if this rule exists it's probably a good reason
– Michel Melhem
Dec 27 '18 at 17:02
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Michel Melhem is a new contributor. Be nice, and check out our Code of Conduct.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53948100%2fhow-i-can-destructuring-this-props-children%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
3 Answers
3
active
oldest
votes
3 Answers
3
active
oldest
votes
active
oldest
votes
active
oldest
votes
You could try the following to destructure children
from this.props
:
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
It looks like your project may require propTypes for this component. Try the following to add a children
prop type. Note, you will need to install package prop-types:
// ...
import PropTypes from 'prop-types';
class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
WallPaper.propTypes = {
children: PropTypes.node // or PropTypes.node.isRequired to make it required
};
export default WallPaper;
Hopefully that helps!
I have already tried this method but I get the error "'children' is missing in props validation"
– Michel Melhem
Dec 27 '18 at 16:41
@MichelMelhemconst { children } = this.props;
would be exactly how you achieve destructuring. If you have PropTypes validations on componentWallPaper
, see this answer for an approach to children PropTypes validation. Try though first removing propTypes temporarily to see if the linting error via this destructuring assignment is resolved. If you continue to have issues after adding children to propTypes validation, share your propTypes code for additional support. Thanks!
– Alexander Staroselsky
Dec 27 '18 at 16:43
Does your project require that each component has propTypes? If so, go ahead and please add propTypes to this component.
– Alexander Staroselsky
Dec 27 '18 at 17:54
add a comment |
You could try the following to destructure children
from this.props
:
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
It looks like your project may require propTypes for this component. Try the following to add a children
prop type. Note, you will need to install package prop-types:
// ...
import PropTypes from 'prop-types';
class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
WallPaper.propTypes = {
children: PropTypes.node // or PropTypes.node.isRequired to make it required
};
export default WallPaper;
Hopefully that helps!
I have already tried this method but I get the error "'children' is missing in props validation"
– Michel Melhem
Dec 27 '18 at 16:41
@MichelMelhemconst { children } = this.props;
would be exactly how you achieve destructuring. If you have PropTypes validations on componentWallPaper
, see this answer for an approach to children PropTypes validation. Try though first removing propTypes temporarily to see if the linting error via this destructuring assignment is resolved. If you continue to have issues after adding children to propTypes validation, share your propTypes code for additional support. Thanks!
– Alexander Staroselsky
Dec 27 '18 at 16:43
Does your project require that each component has propTypes? If so, go ahead and please add propTypes to this component.
– Alexander Staroselsky
Dec 27 '18 at 17:54
add a comment |
You could try the following to destructure children
from this.props
:
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
It looks like your project may require propTypes for this component. Try the following to add a children
prop type. Note, you will need to install package prop-types:
// ...
import PropTypes from 'prop-types';
class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
WallPaper.propTypes = {
children: PropTypes.node // or PropTypes.node.isRequired to make it required
};
export default WallPaper;
Hopefully that helps!
You could try the following to destructure children
from this.props
:
export default class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
It looks like your project may require propTypes for this component. Try the following to add a children
prop type. Note, you will need to install package prop-types:
// ...
import PropTypes from 'prop-types';
class WallPaper extends Component {
render() {
const { children } = this.props;
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{children}
</ImageBackground>
);
}
}
WallPaper.propTypes = {
children: PropTypes.node // or PropTypes.node.isRequired to make it required
};
export default WallPaper;
Hopefully that helps!
edited Dec 27 '18 at 17:59
answered Dec 27 '18 at 16:36


Alexander Staroselsky
11.6k41739
11.6k41739
I have already tried this method but I get the error "'children' is missing in props validation"
– Michel Melhem
Dec 27 '18 at 16:41
@MichelMelhemconst { children } = this.props;
would be exactly how you achieve destructuring. If you have PropTypes validations on componentWallPaper
, see this answer for an approach to children PropTypes validation. Try though first removing propTypes temporarily to see if the linting error via this destructuring assignment is resolved. If you continue to have issues after adding children to propTypes validation, share your propTypes code for additional support. Thanks!
– Alexander Staroselsky
Dec 27 '18 at 16:43
Does your project require that each component has propTypes? If so, go ahead and please add propTypes to this component.
– Alexander Staroselsky
Dec 27 '18 at 17:54
add a comment |
I have already tried this method but I get the error "'children' is missing in props validation"
– Michel Melhem
Dec 27 '18 at 16:41
@MichelMelhemconst { children } = this.props;
would be exactly how you achieve destructuring. If you have PropTypes validations on componentWallPaper
, see this answer for an approach to children PropTypes validation. Try though first removing propTypes temporarily to see if the linting error via this destructuring assignment is resolved. If you continue to have issues after adding children to propTypes validation, share your propTypes code for additional support. Thanks!
– Alexander Staroselsky
Dec 27 '18 at 16:43
Does your project require that each component has propTypes? If so, go ahead and please add propTypes to this component.
– Alexander Staroselsky
Dec 27 '18 at 17:54
I have already tried this method but I get the error "'children' is missing in props validation"
– Michel Melhem
Dec 27 '18 at 16:41
I have already tried this method but I get the error "'children' is missing in props validation"
– Michel Melhem
Dec 27 '18 at 16:41
@MichelMelhem
const { children } = this.props;
would be exactly how you achieve destructuring. If you have PropTypes validations on component WallPaper
, see this answer for an approach to children PropTypes validation. Try though first removing propTypes temporarily to see if the linting error via this destructuring assignment is resolved. If you continue to have issues after adding children to propTypes validation, share your propTypes code for additional support. Thanks!– Alexander Staroselsky
Dec 27 '18 at 16:43
@MichelMelhem
const { children } = this.props;
would be exactly how you achieve destructuring. If you have PropTypes validations on component WallPaper
, see this answer for an approach to children PropTypes validation. Try though first removing propTypes temporarily to see if the linting error via this destructuring assignment is resolved. If you continue to have issues after adding children to propTypes validation, share your propTypes code for additional support. Thanks!– Alexander Staroselsky
Dec 27 '18 at 16:43
Does your project require that each component has propTypes? If so, go ahead and please add propTypes to this component.
– Alexander Staroselsky
Dec 27 '18 at 17:54
Does your project require that each component has propTypes? If so, go ahead and please add propTypes to this component.
– Alexander Staroselsky
Dec 27 '18 at 17:54
add a comment |
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
1
When i use you code i have an Parsing error: Unexpected token 15 | render() { 16 | props => ( > 17 | return ( | ^ 18 | <ImageBackground 19 | source={backgroundimg} 20 | imageStyle={{ opacity: 0.9 }}
– Michel Melhem
Dec 27 '18 at 16:48
sorry, try add this.props, i edit the post.
– Rafael Lucini
Dec 27 '18 at 16:50
add a comment |
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
1
When i use you code i have an Parsing error: Unexpected token 15 | render() { 16 | props => ( > 17 | return ( | ^ 18 | <ImageBackground 19 | source={backgroundimg} 20 | imageStyle={{ opacity: 0.9 }}
– Michel Melhem
Dec 27 '18 at 16:48
sorry, try add this.props, i edit the post.
– Rafael Lucini
Dec 27 '18 at 16:50
add a comment |
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
export default class WallPaper extends Component {
render() {
(this.props) => {
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{props.children}
</ImageBackground>
);
}
}
}
edited Dec 27 '18 at 16:49
answered Dec 27 '18 at 16:41


Rafael Lucini
1566
1566
1
When i use you code i have an Parsing error: Unexpected token 15 | render() { 16 | props => ( > 17 | return ( | ^ 18 | <ImageBackground 19 | source={backgroundimg} 20 | imageStyle={{ opacity: 0.9 }}
– Michel Melhem
Dec 27 '18 at 16:48
sorry, try add this.props, i edit the post.
– Rafael Lucini
Dec 27 '18 at 16:50
add a comment |
1
When i use you code i have an Parsing error: Unexpected token 15 | render() { 16 | props => ( > 17 | return ( | ^ 18 | <ImageBackground 19 | source={backgroundimg} 20 | imageStyle={{ opacity: 0.9 }}
– Michel Melhem
Dec 27 '18 at 16:48
sorry, try add this.props, i edit the post.
– Rafael Lucini
Dec 27 '18 at 16:50
1
1
When i use you code i have an Parsing error: Unexpected token 15 | render() { 16 | props => ( > 17 | return ( | ^ 18 | <ImageBackground 19 | source={backgroundimg} 20 | imageStyle={{ opacity: 0.9 }}
– Michel Melhem
Dec 27 '18 at 16:48
When i use you code i have an Parsing error: Unexpected token 15 | render() { 16 | props => ( > 17 | return ( | ^ 18 | <ImageBackground 19 | source={backgroundimg} 20 | imageStyle={{ opacity: 0.9 }}
– Michel Melhem
Dec 27 '18 at 16:48
sorry, try add this.props, i edit the post.
– Rafael Lucini
Dec 27 '18 at 16:50
sorry, try add this.props, i edit the post.
– Rafael Lucini
Dec 27 '18 at 16:50
add a comment |
This is due to linting rule.
You can turn off rule if you don't want destructing.
If you want than you can do it like this.
export default class WallPaper extends Component {
render() {
const {children} = this.props
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
oui je sais que je peux desactiver cette règle mais si cette règle existe c'est qu'il y a probablement une bonne raison
– Michel Melhem
Dec 27 '18 at 16:58
@MichelMelhem what ?? can you write in English ? can't understand what you have written ?
– Code Maniac
Dec 27 '18 at 17:01
excuse me it was a fail this is the message: yes i know i can disable this rule but if this rule exists it's probably a good reason
– Michel Melhem
Dec 27 '18 at 17:02
add a comment |
This is due to linting rule.
You can turn off rule if you don't want destructing.
If you want than you can do it like this.
export default class WallPaper extends Component {
render() {
const {children} = this.props
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
oui je sais que je peux desactiver cette règle mais si cette règle existe c'est qu'il y a probablement une bonne raison
– Michel Melhem
Dec 27 '18 at 16:58
@MichelMelhem what ?? can you write in English ? can't understand what you have written ?
– Code Maniac
Dec 27 '18 at 17:01
excuse me it was a fail this is the message: yes i know i can disable this rule but if this rule exists it's probably a good reason
– Michel Melhem
Dec 27 '18 at 17:02
add a comment |
This is due to linting rule.
You can turn off rule if you don't want destructing.
If you want than you can do it like this.
export default class WallPaper extends Component {
render() {
const {children} = this.props
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
This is due to linting rule.
You can turn off rule if you don't want destructing.
If you want than you can do it like this.
export default class WallPaper extends Component {
render() {
const {children} = this.props
return (
<ImageBackground
source={backgroundimg}
imageStyle={{ opacity: 0.9 }}
style={styles.container}
>
{this.props.children}
</ImageBackground>
);
}
}
answered Dec 27 '18 at 16:40
Code Maniac
2,9631218
2,9631218
oui je sais que je peux desactiver cette règle mais si cette règle existe c'est qu'il y a probablement une bonne raison
– Michel Melhem
Dec 27 '18 at 16:58
@MichelMelhem what ?? can you write in English ? can't understand what you have written ?
– Code Maniac
Dec 27 '18 at 17:01
excuse me it was a fail this is the message: yes i know i can disable this rule but if this rule exists it's probably a good reason
– Michel Melhem
Dec 27 '18 at 17:02
add a comment |
oui je sais que je peux desactiver cette règle mais si cette règle existe c'est qu'il y a probablement une bonne raison
– Michel Melhem
Dec 27 '18 at 16:58
@MichelMelhem what ?? can you write in English ? can't understand what you have written ?
– Code Maniac
Dec 27 '18 at 17:01
excuse me it was a fail this is the message: yes i know i can disable this rule but if this rule exists it's probably a good reason
– Michel Melhem
Dec 27 '18 at 17:02
oui je sais que je peux desactiver cette règle mais si cette règle existe c'est qu'il y a probablement une bonne raison
– Michel Melhem
Dec 27 '18 at 16:58
oui je sais que je peux desactiver cette règle mais si cette règle existe c'est qu'il y a probablement une bonne raison
– Michel Melhem
Dec 27 '18 at 16:58
@MichelMelhem what ?? can you write in English ? can't understand what you have written ?
– Code Maniac
Dec 27 '18 at 17:01
@MichelMelhem what ?? can you write in English ? can't understand what you have written ?
– Code Maniac
Dec 27 '18 at 17:01
excuse me it was a fail this is the message: yes i know i can disable this rule but if this rule exists it's probably a good reason
– Michel Melhem
Dec 27 '18 at 17:02
excuse me it was a fail this is the message: yes i know i can disable this rule but if this rule exists it's probably a good reason
– Michel Melhem
Dec 27 '18 at 17:02
add a comment |
Michel Melhem is a new contributor. Be nice, and check out our Code of Conduct.
Michel Melhem is a new contributor. Be nice, and check out our Code of Conduct.
Michel Melhem is a new contributor. Be nice, and check out our Code of Conduct.
Michel Melhem is a new contributor. Be nice, and check out our Code of Conduct.
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53948100%2fhow-i-can-destructuring-this-props-children%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
J6 ZYdffXfZSjyZsPx8AajBoUO,v 8wfcGZ7W2cdlQD,gabp,z
3
github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/… explains this rule better.
– apokryfos
Dec 27 '18 at 16:37
Also this is a linter rule so not technically an error so unless you're working in a team that is enforcing a specific rule set then you should modify the rules to ones you are most comfortable with working.
– apokryfos
Dec 27 '18 at 16:38