logo
down
shadow

Does component state need to be a separate object?


Does component state need to be a separate object?

By : Catherine
Date : November 22 2020, 10:56 AM
wish helps you You can do this but I wouldn’t recommend it. Your code will be clearer when you show what the initial state looks like. A little explanation why it is possible to do though:
The docs on getInitialState (source):
code :


Share : facebook icon twitter icon
How shared state between separate component in React JS?

How shared state between separate component in React JS?


By : Lokesh Sukhwal
Date : March 29 2020, 07:55 AM
fixed the issue. Will look into that further I found a solution based on @Andrew answers. Not sure if this is right. But it solves the shared state, only use by Dropdown. I pass the handler and content via props
What do you think?
code :
import React from 'react';
import {Dropdown} from '../../components/Dropdown/Dropdown.jsx';

class HeaderConnected extends React.Component {

    constructor(props) {
        super(props);
    }

    render() {
        return (
            <div>
              <Dropdown handler={<Avatar title="Roberto" />}>
                  <li>Menu</li>
                  <li>Settings</li>
              </Dropdown>
            </div>
        );
    }

}

export default HeaderConnected;
export class Dropdown extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            opened: false
        }
    }

    render() {

        return (
            <div className="DROPDOWN">
               <div className="DROPDOWN_HANDLER" onClick="...">
                   {this.props.handler}
               </div>
               <div className="DROPDOWN_CONTENT">
                   {this.props.children}
               </div>
            </div>
        );
    }

}
How to access one component state in another component if those two component define in separate files in react native

How to access one component state in another component if those two component define in separate files in react native


By : kocofx2
Date : March 29 2020, 07:55 AM
will be helpful for those in need Do you call/import one.js inside two.js? if you do, you can pass the state from one.js using props.
EDIT:
code :
import PageTwo from 'Two';
...
export default class PageOne extends React.Component{
 constructor(props) {
   super(props);
   this.state = { somethingSomething: 'whatever'};
 }
  render() {
   return (
     <View>
       <PageTwo propsname = {this.state.somethingSomething}>
       </PageTwo>
     </View>
   )
  }
}
…
export default class PageTwo extends React.Component{
  ...
  render() {
    return (
      <View>
        {alert(this.props.propsname)}
      </View>
    )
  }
}
How to access state value from one component to other function(not component) which is in separate file? React js

How to access state value from one component to other function(not component) which is in separate file? React js


By : Stéphane LEROY
Date : March 29 2020, 07:55 AM
To fix the issue you can do This is my Home Component: , You should pass page state as a parameter to your function :
code :
async componentDidMount() {
  const val = await getData(this.state.page);
}
export const getData = (page) => {
  const url = `http://randomuser.in/${page}`;
  fetch(url)
    .then(res => res.json())
    .then(res => {
      return res;
    })
    .catch(error => {
      console.log('error:', error);
    });
};
ReactJS: Can I separate a function that changes state in a separate component?

ReactJS: Can I separate a function that changes state in a separate component?


By : Begineer0201
Date : March 29 2020, 07:55 AM
should help you out Yes, create a function and return the repsonse-data, must use async await
code :
//fetchService.js
    import axios from 'axios';
    export default async function fetchService(){
       let responseData = [];    
       await axios.get('./data.json')
          .then((res) => {
             responseData = res.data;
          })
          .catch((err) => {
            console.log(err);
          });
       return responseData;
    }
// App.js
import fetchService from './fetchService';
 async componentDidMount() {
    let tempData = await fetchService();
     this.setState({
          siteData: tempData,
     });
  }
How to separate the state inside a reusable component

How to separate the state inside a reusable component


By : andrew maggs
Date : October 20 2020, 06:10 AM
this will help So there's a lot of issues here. The code is extremely verbose and hard to follow and you are not taking advantage of the features React offers (respectfully, I've never seen the Pythagorean Theorem used in a carousel!). To answer your question, the reason the controls are affecting all the sliders is because you are controlling their position with CSS properties that you are adding to the body in the right/left functions:
code :
document.body.style.setProperty('--item-left-food', -cP*this.state["distance" +this.props.id] + "px"); 
shadow
Privacy Policy - Terms - Contact Us © ourworld-yourmove.org