& nbsp জেএসএক্স কাজ করছে না


101

আমি জেএসএক্সে & nbsp ট্যাগ ব্যবহার করছি এবং এটি স্থানটি সরবরাহ করছে না। নিম্নলিখিতটি আমার কোডের একটি ছোট স্নিপেট। অনুগ্রহ করে সহায়তা করুন।

var Reporting=React.createClass({

  render: function(){
    return(
      <div style={divPositionReporting}>
          <p>Pricing Reports</p>
          <hr></hr>
          Select Scenario:&nbsp;&nbsp;
          <select>
            <option></option>
          </select>
          <button type="button">Get Pricing Report</button>
          <br/>
          Select Takeout Scenario:&nbsp;
          <select>
            <option></option>
          </select>
          <button type="button">Get Pricing Report</button>
          <br/>
      </div>
    );
  },

});

আপনি অনুসন্ধান করেছেন? প্রথম হিট: google.com/search?q=react+html+entities
ফেলিক্স ক্লিং

আপনার কোডে কোনও ভুল আছে বলে আমি মনে করি না। কোন বাবেল এবং প্রতিক্রিয়া সংস্করণ ব্যবহার করছে? সর্বশেষতম সংস্করণ ব্যবহার নিশ্চিত করুন। আপনি বাবেল প্রতিবেদনে দেখতে পাবেন যে উত্পন্ন কোডটিতে নন-ব্রেকিং হোয়াইটস্পেস অক্ষর রয়েছে।
ফেলিক্স ক্লিং

ভাল এখন প্রথম হিট এটি। :) duckduckgo.com/?q=jsx+nbsp
মার্ক স্টোবার

উত্তর:


213

দেখুন: গভীরতার জেএসএক্স

চেষ্টা করুন: Select Scenario:{'\u00A0'}

বা: <div dangerouslySetInnerHTML={{__html: 'Select Scenario: &nbsp;'}} />

বা: <div>&nbsp;</div>

jsfiddle

হালনাগাদ

কিছু মন্তব্য দেখার পরে এবং চেষ্টা করে দেখুন। আমার নজরে এসেছে যে জেএসএক্সের মধ্যে এইচটিএমএল এনটাইটগুলি ব্যবহার করা ভাল কাজ করে (উপরের জেএসএক্স-গ্যাটাচাস রেফারেন্সের [যা সম্ভবত এটি পুরানো]] থেকে ভিন্ন।

সুতরাং: এর মতো কিছু ব্যবহার করে R&amp;Dআউটপুট হবে: 'আর অ্যান্ড ডি'। এর সাথে একটি অদ্ভুত আচরণ রয়েছে &nbsp;, যার কারণে এটি অন্যরকমভাবে রেন্ডার হয়ে যায়, এইভাবে এটি আমাকে কাজ করে না তা ভাবতে বাধ্য করে:

<div>This works simply:-&nbsp;-</div>
<div>This works simply:- {'\u00A0'}-</div>

উত্পাদন:

This works simply:- -
This works simply:-  -

8
সুতরাং উত্তরটি এইচটিএমএল সত্তার সাথে সম্পর্কিত ইউনিকোড মান ব্যবহার করে এবং জাভাস্ক্রিপ্ট স্ট্রিংয়ের অভ্যন্তরে ব্যবহার করছে। আপনার সাহায্যের জন্য ধন্যবাদ.
ইন্দ্রনীল বেন্দে

@IndraneelBende &nbsp;জরিমানা কাজ করা উচিত। স্টাইল অ্যাট্রিবিউটের মান নিয়ে কিছু সমস্যা আছে।
গৌরব কুমার

@ গৌরব কুমার, আমি চেষ্টা করেছিলাম কোনও কাজ হয়নি, এটি কেবল উপেক্ষা করা হয়েছে। আপনি কি আমার উত্তরে মুলতুবি যোগ করতে পারেন?
omets

4
<div>Doesn't work: -&nbsp;-</div>আমার জন্য ঠিক কাজ করে। সম্পাদনা: ভাল, এটি একটি অবিচ্ছেদী জায়গা বলে মনে হচ্ছে না।
ফেলিক্স ক্লিং

এমএমএইচ, যদিও প্রতিক্রিয়া ওয়েবসাইটে নিজেই প্রত্যাশিত আউটপুট উত্পাদন করে ...
ফেলিক্স ক্লিং


17

নীচে প্রদর্শিত হিসাবে আপনার jsxকোড মোড়ানো লিখুন { }

<h1>Code {' '}</h1>

আপনি এখানে স্থান বা কোনও বিশেষ অক্ষর রাখতে পারেন।

যেমন আপনার ক্ষেত্রে

Select Takeout Scenario:&nbsp;

এই মত হওয়া উচিত

Select Takeout Scenario:{' '}

এটা কাজ করবে।

পরামর্শ হিসাবে আপনার &nbspঅতিরিক্ত স্থান যুক্ত করার জন্য ব্যবহার করা উচিত নয় , আপনি এটি অর্জনের জন্য CSS ব্যবহার করতে পারেন ।


4
এটি কেবল হোয়াইটস্পেস যুক্ত করার জন্য, তবে অন্যান্য এইচটিএমএল সত্তার পক্ষে কাজ করবে না
আমেরিকান

4
যদিও এটি একটি অ-ব্রেকিং স্পেস নয়।
টিমোসোলো

4
@ টিমোসোলো আমি আপনাকে & nbsp বা উপরে উল্লিখিত কৌশল ব্যবহার করতে উত্সাহিত করি না। আমার কাজ না করে থাকলে আপনি প্রথম উত্তরটি চেষ্টা করতে পারেন। ধন্যবাদ
উইটভল্ট

"একই অর্জনের জন্য সিএসএস ব্যবহার করুন" - আপনি সম্ভবত নন ব্রেকিং স্পেস ব্যবহার করছেন যাতে আপনার পাঠ্যটি পরবর্তী পংক্তিতে এবং পাঠ্যযুক্ত উপাদানটির সীমানার বাইরে নেমে না যায়। আপনি যদি পরিবর্তে এটি করার জন্য সিএসএসের বৈশিষ্ট্যগুলি ব্যবহার করতে চান তবে এটি করার একটি উপায় text-overflow: "clip"; overflow: "hidden";। কয়েকটি বৈকল্পিক উপলব্ধ।
ড্যান ক্রোন

4

এটি যদি আপনার {' '}পক্ষে কাজ না করে তবে ব্যবহার করুন {'\u00A0'}

{' '}একটি স্থান রেন্ডার করবে তবে এমন কিছু ক্ষেত্রে রয়েছে যখন আপনি চান যে কোনও ক্ষেত্রে লাইন উচ্চতাও রেন্ডার করা হোক সেখানে আপনি এইচটিএমএল উপাদানটির অভ্যন্তরে একটি স্থান চান যাতে অন্য কোনও পাঠ্য নেই যেমন:, সেক্ষেত্রে <span style={{ lineHeight: '1em' }}>{' '}</span>আপনাকে {'\u00A0'}অভ্যন্তরের অভ্যন্তরে ব্যবহার করতে হবে স্প্যান বা এইচটিএমএল উপাদান।


1

ইউটিএফ -8 এনপিএস ব্যবহার করার চেষ্টা করুন, সাধারণ জায়গা হিসাবে মনে হলেও অতিরিক্ত কোড ছাড়াই ভাল কাজ করছেন।

হতে পারে, এর জন্য আপনার পরিবর্তনশীল তৈরি করা উচিত।

অনুলিপি প্রতীকগুলির জন্য: https://unicode-table.com/en/00A0/

স্বয়ংক্রিয়ভাবে পাঠ্য উত্পন্ন করার জন্য, কিছু টাইপোগ্রাফ ব্যবহার করুন।


আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.