Where to get props and set props in a functional component in React Js?

Question

props data coming from the parent component

const [state, setState] = useState({

reportTypesVal: { label: "", value: "" } || props?.reportTypesVal});

Why I'm unable to set data like this to reportTypesVal? If I try to set data in useEffect It doesn't set the value to reportTypesVal. How can I do this?

Answer 1

Your question is a bit unclear, but from the title:

Where to get props and set props in a functional component in React Js?

I assume you're asking how to pass props, here is an example on the new beta documentation: https://beta.reactjs.org/learn/passing-props-to-a-component

Answer 2

You should implement it in the child name function.

EX:

import ...
import ...

function showSomething( {MyProps1, MyProps2} )  // <---- here
{
   useEffect(() => {
        
        console.log(MyProps1);      

   }
...
}

Answer 3

This is how you pass props into a component:

<Component property={'randomText'} />

This is how you retrieve it in the component:

function Component (props) = {
  return (
    <p>{props.property}</p>
  )
}

You can change the property inside of the component by using states and passing the set function as a property:

const [randomText, setRandomText] = React.useState('randomText')
return(
    <Component property={randomText} propertySet={setRandomText} />
)

Inside the component you can do:

function Component (props) = {
      return (
        <button onClick={() => {props.setRandomText('randomText2')}}>{props.randomText}</button>
      )
    }

Then when you click the button it will change to 'randomText2'