Home > Software engineering >  I created a function in ReactJs but it's not working. Can anyone help please
I created a function in ReactJs but it's not working. Can anyone help please

Time:05-12

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

CodePudding user response:

You are mixing syntax. Template strings require backticks.

`${firstName} ${lastName}`

If you want to use single quotes

firstName   ' '   lastName

CodePudding user response:

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

CodePudding user response:

You are using single quotes use backticks(Template literals) instead

const getFullName = (firstName,lastName) => `${firstName} ${lastName}`

Learn about template literals here

CodePudding user response:

I would simply do it this way:

const getFullName = (firstName,lastName) => firstName   ' '   lastName

CodePudding user response:

But in function you can try this one..

const getFullName=(firstName,lastName) => {
return firstName " " lastName;
}
  • Related