InsideDarkWeb.com

Weird special characters in string while using backtick with single quote or double quote with t function on react

I have a method named makeGreeting(someData) inside the class component in React as

makeGreeting(person){
   return `${person.firstName} ${person.lastName} - ${person.greetings}`;
}

In the same file inside the render method return section, we have called for ViewGreeting component which is in some other file.this.props.personData we are receiving from another component using user input

  <ViewGreeting
     heading={t("common:GREETING_LEVEL")}
     description={t("common:SOME_ANOTHER_LEVEL", {
                  subject: this.makeGreeting(this.props.personData),
                 })}     
   />

Our ViewGreeting component in some another file is as follows

  <ViewGreeting>
      <h2>{props.heading}</h2>
      <p>{props.description}</p>
   </ViewGreeting>

Now when we give data such as:

firstName: "fn",
lastName: "ln"
greeting: "Hello"

then it prints perfectly in ViewGreeting component as fn ln - hello.
but if we give input such as

firstName: "fn",
lastName: "ln"
greeting: "Hello'msg"

or

firstName: "fn",
lastName: "ln"
greeting: "Hello"msg"

means single or double quote inside the greeting message then it prints weird characters in ViewGreeting component as:

fn ln - hello'msg

How should I correct it? I want same greeting in the component as it passed from user input with a single or double quote not these special characters in the Viewgreeting component.

Stack Overflow Asked by Asis on November 22, 2021

0 Answers

Add your own answers!

Related Questions

How to cut a string to the first “/” from right to left c# .net

1  Asked on August 1, 2020 by ignacio-gomez

   

Inserting random data from a list

2  Asked on August 1, 2020 by smiley

     

Invalid token SELECT

2  Asked on July 31, 2020 by virendra-varma

     

Django – No column found for custom field?

0  Asked on July 29, 2020 by jare42

       

Package.json with multiple entrypoints

1  Asked on July 29, 2020 by jeanluca-scaljeri

   

REACT vs REACT_PROJECT vs WEBPACK for storybook type?

1  Asked on July 29, 2020 by temporary_user_name

 

Random Background Image from Button Click

1  Asked on July 29, 2020 by charmy

       

Systemd-journald disk wear-out

0  Asked on July 29, 2020 by rohit

       

Function composition using Go syntax

1  Asked on July 28, 2020 by overexchange

     

Ask a Question

Get help from others!

© 2021 InsideDarkWeb.com. All rights reserved.