मेरे पास कुछ प्रॉप्स हैं जिनमें एक स्ट्रिंग है जिसमें & जैसे अक्षर हो सकते हैं। इसमें रिक्त स्थान भी हैं। मैं सभी स्थानों को बदलना चाहता हूं ।
वहाँ एक आसान तरीका है मैं यह कर सकता हूँ? ध्यान रखें कि मैं इस सिंटैक्स का उपयोग करके प्रस्तुत नहीं कर सकता:
<div dangerouslySetInnerHTML={{__html: myValue}} />
क्योंकि मुझे पहले किसी HTML संस्थाओं को उनके मार्कअप से बदलना होगा। मैं ऐसा नहीं करना चाहता, यह बहुत कम स्तर लगता है।
कोई तरीका है तो मुझसे यह हो सकता है?
 l;, क्या आप HTML टैग्स को शाब्दिक रूप से प्रदर्शित करना चाहते हैं या कुछ और है जो आप करना चाहते हैं?
myValue सुलभ है पर निर्भर करता है। आप उपयुक्त जीवन चक्र समारोह में इसके लिए प्रतीक्षा कर सकते हैं, इसे पार्स कर सकते हैं और एक parsedध्वज सेट कर सकते हैं जो कई पार्सिंग को रोकता है।
dangerouslySetInnerHTMLविधि का उपयोग करने की आवश्यकता है । मुझे वास्तव में ऐसा कोई रास्ता दिखाई नहीं दे रहा है कि जब से आप जावास्क्रिप्ट का उपयोग कर सकते हैं एक स्ट्रिंग बनाने के लिए रिक्त स्थान बनाने के लिए & nbsp; लेकिन dangerouslySetInnerHTMLविधि का उपयोग किए बिना ये प्रतिक्रिया से बच जाएंगे।
जवाबों:
HTML इकाई का उपयोग करने के बजाय , आप यूनिकोड वर्ण का उपयोग कर सकते हैं जो (U + 00A0 NON-BREAKING SHACE) को संदर्भित करता है:
<div>{myValue.replace(/ /g, "\u00a0")}</div>
मुझे पता है कि यह एक पुराना सवाल है, और यह वही नहीं है जो आपने पूछा था, बल्कि स्ट्रिंग को संपादित करने के बजाय, आप जो हासिल करना चाहते हैं वह शायद सीएसएस white-space: nowrapविशेषता का उपयोग करके बेहतर तरीके से हल किया जा सकता है :
Html में:
<div style="white-space: nowrap">This won't break lines</div>
प्रतिक्रिया में:
<div style={{ whiteSpace: 'nowrap' }}>{myValue}</div>
यदि आप एक सुंदर xml प्रदर्शित करना चाहते हैं:
var str = "<test>\n\t\t<value>1</value>\n</test>\n".replace(/</g, '<').replace(/>/g, '>').replace(/\t/g, "\u00a0").replace(/\n/g, '<br/>');
return (
<div dangerouslySetInnerHTML={{__html: str}} ></div>
)
वैसे इसे गायब किए बिना यहां टाइप करना बहुत मुश्किल है, इसलिए मैं थोड़ा व्हाट्सएप जोड़ रहा हूं ताकि हर कोई इसे देख सके। यदि आप इस टैग <nbsp /> से व्हाट्सएप को हटा देते हैं, तो आप प्रतिक्रिया में गैर-ब्रेकिंग स्पेस का उपयोग कर पाएंगे।
रिएक्ट इस JSX टैग को नॉन-ब्रेकिंग स्पेस में तब्दील करता है। अजीब क्विर्क: इसका उपयोग उसी लाइन पर भी किया जाना चाहिए जिस पाठ को आप स्पेस देना चाहते हैं। इसके अलावा, इस टैग के साथ गैर-ब्रेकिंग स्पेस रिएक्ट में स्टैक नहीं करते हैं।
Warning: The tag <nbsp> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter
तो आपके पास इस "नमस्ते दुनिया" जैसा एक मूल्य है, और हम कहेंगे कि यह अंदर है this.props.value।
तुम यह केर सकते हो:
var parts = this.props.value.split(" "), array = [];
for (var i=0; i<parts.length; i++){
// add the string
array.push(<span key={i * 2}>{parts[i]}</span>);
// add the nbsp
array.push(<span key={i * 2 + 1}> </span>);
}
// remove the trailing nbsp
array.pop();
return <div>{array}</div>;