'I created a function in ReactJs but it's not working
Code:
import './App.css';
function App() {
const firstName = 'Toto';
const lastName = 'Wolff';
const age = 35;
const job = 'Principal';
const getFullName = (firstName,
lastName) => '${firstName} ${lastName}'
return (
<div className="App">
<h3>Full Name: {getFullName(firstName,
lastName)} </h3>
<p>Age : {age}</p>
<p>Job : {job}</p>
</div>
);
}
export default App;
Output:
Full Name: ${firstName} ${lastName}
Age : 35
Job : Principal
Solution 1:[1]
You are mixing syntax. Template strings require backticks.
`${firstName} ${lastName}`
If you want to use single quotes
firstName + ' ' + lastName
Solution 2:[2]
Your code is fine its just you used single quotes '' instead of backquotes `` here
const getFullName = (firstName,
lastName) => `${firstName} ${lastName}`
full code
import './App.css'
function App() {
const firstName = 'Toto';
const lastName = 'Wolff';
const age = 35;
const job = 'Principal';
const getFullName = (firstName,
lastName) => `${firstName} ${lastName}`
return (
<div className="App">
<h3>Full Name: {getFullName(firstName,
lastName)} </h3>
<p>Age : {age}</p>
<p>Job : {job}</p>
</div>
);
}
export default App;
see: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
Solution 3:[3]
You are using single quotes use backticks(Template literals) instead
const getFullName = (firstName,lastName) => `${firstName} ${lastName}`
Solution 4:[4]
I would simply do it this way:
const getFullName = (firstName,lastName) => firstName + ' ' + lastName
Solution 5:[5]
But in function you can try this one..
const getFullName=(firstName,lastName) => {
return firstName+" "+lastName;
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | Tushar Shahi |
Solution 2 | Bas bas |
Solution 3 | Shubham Mistry |
Solution 4 | Onki Hara |
Solution 5 |