React getting error identifier or string literal or numeric literal expected

While am doing some code , am facing some error. I have the json as

{
            "EmployeeId": "3094",
            "sectionName": "A&M Finance",
    },

but in React rendering am getting ” &amp” text between A and M then i tried to find a solution for the same and just heard about dangerouslySetInnerHTML , i tried replicating same , but am getting an error like identifier or string literal or numeric literal expected

Here is the piece of code i tried (in rendering am just calling a method truncateMethod,since i need to restrict word length as well )

export function truncateMethod(sectionName, length) {
  if (sectionName.length > length) {
    const newVal = dangerouslySetInnerHTML={{__html: sectionName }}
    return newVal.slice(0, length).concat('...');
  }
  return newVal;
}

Finally what i am trying to achieve is i need to render like A&M Finance

Can you guys help me what am trying to do or if you need more explanation am happy to help in comments

So possibly 2 things -> Either help me to get rid &amp text in react rendering -> or help me to resolve the error while i use dangerouslysethtml (am getting error identifier or string literal or numeric literal expected )

Answer

dangerouslySetInnerHTML is used in the JSX element, not in defining a const. For example:

<div dangerouslySetInnerHTML={truncateMethod(someString, 10)} />

Your method itself also has another bug. When the if condition is false then the method returns undefined because you never defined newVal. I suspect you meant something like this:

export function truncateMethod(sectionName, length) {
    if (sectionName.length > length) {
        return sectionName.slice(0, length).concat('...');
    }
    return sectionName;
}