CODEWITHSUNDEEP
javascriptreactjs
Ayaan Abbasi
Ayaan Abbasi

Reputation: 105

ReactJS(jsx) Passing Parameters

I am new to react and I was wondering why does the parameter (a) need to be passed with variables e.g a.amount, a.date. What is the process and reasoning behind this?

Upvotes: 4

Views: 12091

Answers (3)

tomnyson
tomnyson

Reputation: 297

you passed a prop in your component.

import HelloMessage from "./HelloMessage";
export default function App() {
  return (
    <div className="App">
      <HelloMessage name={"tomnyson"} />
    </div>
  );
}

export default function HelloMessage({name}) {
  return (
    <h1>{name}</h1>
  )
}

enter image description here

link source: https://codesandbox.io/s/hopeful-tesla-3uk94?file=/src/App.js look this document

https://reactjs.org/docs/components-and-props.html

Upvotes: 0

doge
doge

Reputation: 33

React takes in a object name, to which you have given the name : a

If you have studied Objects in JavaScript, then to fetch the data, we use 'MyObj'.'key' to fetch the data, here is an example:

const user = { first_name = 'Ayaan', last_name = 'Abbasi } so, to fetch your first name, we do the following: document.write(user.first_name)

hence, in your example, your variable name is a and your data is the title, hence, to fetch your title, you can do a.title ,

for further information on components and props, please read this

Upvotes: 1

Canser Yanbakan
Canser Yanbakan

Reputation: 3870

The general name for it "props" (in your component it is "a").

"Props" is an object that has all the properties passed to the component.

For example;

<ExampleComponent isEnabled={true} isClickable={false} />

Then you can access those properties in your component in two ways;

1: Get the prop variable and use it an object as you do in your example. 2: Destruct the object in your component to use as you want.

const ExampleComponent = ({isEnabled, isClickable}) => {
    return "<></>";
});

For more information:

https://reactjs.org/docs/components-and-props.html

Upvotes: 5

Related Questions