[英]Adding link to object value in reactJS
I have this object where i put the english translation in a reactJs app, is it possible to add the url of description.href so i can make the word "here" in the description.paragraphe a link i have added it as HTML but i got the html as text I have this object where i put the english translation in a reactJs app, is it possible to add the url of description.href so i can make the word "here" in the description.paragraphe a link i have added it as HTML but i得到 html 作为文本
const EnMessages = {
ra: {
notation: {
base: 'out of',
read: 'Read the'
},
description: {
title: 'About the book',
paragraphe: 'The book shown were written by x, check it here',
href: 'https://url.com/en',
}
}
};
description: {
title: 'About the book',
paragraphe: 'The book shown were written by x, check it <a href="https://url.com/en">here</a>'
}
You could put it together in the return statement, like this:您可以将其放在 return 语句中,如下所示:
const EnMessages = {
ra: {
notation: {
base: 'out of',
read: 'Read the'
},
description: {
title: 'About the book',
paragraphe: 'The book shown were written by x',
href: 'https://url.com/en',
}
}
};
const MessageComponent = (props) => {
const { paragraphe, href } = EnMessages.ra.description;
return (
<div>
{paragraphe}, check it
<a href={href}>here</a>
</div>
);
};
The way i would go about this is to seperate the paragraph into two parts like so:我会 go 关于这个的方式是将段落分成两部分,如下所示:
description: {
title: 'About the book',
paragraphePart1: 'The book shown were written by x, check it ',
paragraphePart2: 'here',
href: 'https://url.com/en',
}
and then simply put this in my JSX:然后简单地把它放在我的 JSX 中:
<h3>{description.title}</h3>
<p>{description.paragraphePart1}<a href={description.href}>{description.paragraphePart2}<a/></p>
You need to use dangerouslySetInnerHTML
to achieve that functionality您需要使用
dangerouslySetInnerHTML
来实现该功能
for example:例如:
<div dangerouslySetInnerHTML={{__html: yourHTMLCodeHere }}></div>
Now you can add your code in yourHTMLCodeHere
variable and use it.现在您可以在您的
yourHTMLCodeHere
变量中添加代码并使用它。
But I think use dangerouslySetInnerHTML is a bad practice.但我认为使用 dangerouslySetInnerHTML 是一种不好的做法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.