আমার কিছু প্রপস রয়েছে যার একটি স্ট্রিং রয়েছে যাতে & এর মতো অক্ষর থাকতে পারে। এটিতে স্থানও রয়েছে। আমি সব শূণ্যস্থান প্রতিস্থাপন করতে চান ।
আমি কি এটি করার সহজ উপায় আছে? মনে রাখবেন যে আমি এই সিনট্যাক্সটি ব্যবহার করে কেবল রেন্ডার করতে পারি না:
<div dangerouslySetInnerHTML={{__html: myValue}} />
কারণ আমাকে প্রথমে যে কোনও HTML সত্তাকে তাদের মার্কআপের সাথে প্রতিস্থাপন করতে হবে। আমি এটি করতে চাই না, এটি খুব নিম্ন স্তরের বলে মনে হচ্ছে।
আমি কি এই উপায় আছে?
 l;করতে চান, আপনি কি HTML ট্যাগগুলিকে অক্ষরে অক্ষরে প্রদর্শন করতে চান বা অন্য কিছু করতে চান?
myValue অ্যাক্সেসযোগ্য তা নির্ভর করে । আপনি উপযুক্ত লাইফসাইकल ফাংশনে এটির জন্য অপেক্ষা করতে পারেন, এটি বিশ্লেষণ করতে এবং এক parsedপতাকা সেট করতে পারেন যা একাধিক বিশ্লেষণ রোধ করে।
dangerouslySetInnerHTMLপদ্ধতি ব্যবহার করা প্রয়োজন । আমি সত্যিই এর আশেপাশের কোনও উপায় দেখতে পাচ্ছি না যেহেতু আপনি জাভাস্ক্রিপ্ট ব্যবহার করতে পারেন এমন একটি স্ট্রিং তৈরি করতে যাতে & nbsp; স্পেস প্রতিস্থাপন করে; তবে dangerouslySetInnerHTMLপদ্ধতিটি ব্যবহার না করে এগুলি প্রতিক্রিয়া দেখিয়ে পালিয়ে যাবে।
উত্তর:
এইচটিএমএল সত্তা ব্যবহার করার পরিবর্তে , আপনি ইউনিকোড অক্ষর ব্যবহার করতে পারেন যা (U + 00A0 নন-BREAKING স্পেস) নির্দেশ করে:
<div>{myValue.replace(/ /g, "\u00a0")}</div>
আমি জানি এটি একটি পুরানো প্রশ্ন, এবং এটি আপনি যা চেয়েছিলেন ঠিক তা করে না, তবে স্ট্রিং সম্পাদনা করার চেয়ে আপনি যা অর্জন করতে চান তা সম্ভবত সিএসএস white-space: nowrapঅ্যাট্রিবিউট ব্যবহার করে আরও ভাল সমাধান করা হবে :
এইচটিএমএলে:
<div style="white-space: nowrap">This won't break lines</div>
প্রতিক্রিয়া:
<div style={{ whiteSpace: 'nowrap' }}>{myValue}</div>
ভাল এটি অদৃশ্য না হয়ে এখানে টাইপ করা খুব শক্ত, তাই আমি কিছুটা সাদা জায়গা যুক্ত করছি যাতে সবাই এটি দেখতে পারে। আপনি যদি এই ট্যাগ <<<<> থেকে সাদা স্থানটি সরিয়ে ফেলেন তবে আপনি প্রতিক্রিয়াতে একটি অ-ব্রেকিং স্পেস ব্যবহার করতে সক্ষম হবেন।
প্রতিক্রিয়া এই জেএসএক্স ট্যাগটিকে একটি নন-ব্রেকিং স্পেসে অনুবাদ করে। অদ্ভুত কীর্তি: আপনি যে পাঠ্যটি ফাঁকা রাখতে চান তা একই লাইনেও ব্যবহার করতে হবে। এছাড়াও, এই ট্যাগ সহ অ-ব্রেকিং স্পেসগুলি প্রতিক্রিয়াতে স্ট্যাক করে না।
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>;