Optionচ্ছিক পথ পরামিতি সহ রাউটার প্রতিক্রিয়া

Question

আমি একটি optionচ্ছিক পাথ প্যারামিটার সহ একটি পাথ ঘোষণা করতে চাই, অতএব আমি যখন পৃষ্ঠাটি অতিরিক্ত কিছু করার জন্য যুক্ত করি (যেমন কিছু ডেটা পূরণ করুন):

http: // লোকালহোস্ট / অ্যাপ / পাথ / টু / পৃষ্ঠা <= পৃষ্ঠাটি রেন্ডার করুন http: // লোকালহস্ট / অ্যাপ / পাথ / থেকে / পৃষ্ঠা / পাথারাম <= পৃষ্ঠারাম অনুসারে কিছু ডেটা সহ পৃষ্ঠাটি রেন্ডার করুন

আমার প্রতিক্রিয়া রাউটারে দুটি বিকল্পকে সমর্থন করার জন্য আমার নিম্নলিখিত পথগুলি রয়েছে (এটি একটি সরল উদাহরণ):

<Router history={history}>    
   <Route path="/path" component={IndexPage}>
      <Route path="to/page" component={MyPage}/>
      <Route path="to/page/:pathParam" component={MyPage}/>
   </Route>    
</Router>

আমার প্রশ্ন হ'ল আমরা কি এটি একটি রুটে ঘোষণা করতে পারি ? আমি যদি কেবল দ্বিতীয় সারিতে যুক্ত করি তবে প্যারামিটার ছাড়াই রুটটি পাওয়া যায় না।

সম্পাদনা # 1:

নিম্নলিখিত বাক্য গঠন সম্পর্কে এখানে উল্লিখিত সমাধানটি আমার পক্ষে কার্যকর হয়নি, এটি কি সঠিক? এটি কি নথিতে বিদ্যমান?

<Route path="/product/:productName/?:urlID?" handler={SomeHandler} />

আমার প্রতিক্রিয়া-রাউটার সংস্করণটি: 1.0.3

Answer 1

আপনার পোস্ট করা সম্পাদনাটি প্রতিক্রিয়া-রাউটার (v0.13) এর পুরানো সংস্করণের জন্য বৈধ ছিল এবং এটি আর কাজ করে না।

---

রাউটার প্রতিক্রিয়া v1, v2 এবং v3

সংস্করণ যেহেতু 1.0.0আপনি এর সাথে alচ্ছিক পরামিতিগুলি সংজ্ঞায়িত করেন:

<Route path="to/page(/:pathParam)" component={MyPage} />

এবং একাধিক al চ্ছিক পরামিতিগুলির জন্য:

<Route path="to/page(/:pathParam1)(/:pathParam2)" component={MyPage} />

শীর্ষস্থানীয় স্ল্যাশ ( ) সহ( ) রাস্তার alচ্ছিক অংশগুলি মোড়ানোর জন্য আপনি প্রথম বন্ধনী ব্যবহার করেন । পরীক্ষা করে দেখুন রুট মেলা গাইড সরকারী নথিপত্রের পাতা।/

নোট: পরামিতি একটি URL সেগমেন্ট পাশে আপ সাথে মেলে , বা । বিশেষত পাথ এবং প্যারাম সম্পর্কে আরও জানতে এখানে আরও পড়ুন ।:paramName/?#

---

রাউটার ভি 4 এবং তার উপরে প্রতিক্রিয়া জানান

প্রতিক্রিয়া রাউটার ভি 4 মূলত ভি 1-ভি 3 এর চেয়ে পৃথক, এবং pathচ্ছিক পাথ প্যারামিটারগুলি সরকারী ডকুমেন্টেশনে সুস্পষ্টভাবে সংজ্ঞায়িত করা হয়নি ।

পরিবর্তে, আপনাকে এমন একটি pathপরামিতি সংজ্ঞায়িত করার নির্দেশ দেওয়া হয়েছে যা পাথ-টু-রেজিএক্সপ্যাক্স বুঝতে পারে। এই যেমন পুনরাবৃত্তি নিদর্শন, ওয়াইল্ডকার্ড, ইত্যাদি সুতরাং হিসাবে আপনার পথ, সংজ্ঞায়িত একটি প্যারামিটার ঐচ্ছিক হিসাবে আপনি একটি trailing প্রশ্নোত্তর চিহ্ন যোগ সংজ্ঞায়িত করার জন্য অনেক বেশি নমনীয়তা জন্য করতে পারবেন ( ?)।

যেমন একটি alচ্ছিক প্যারামিটার সংজ্ঞায়িত করতে, আপনি:

<Route path="/to/page/:pathParam?" component={MyPage} />

এবং একাধিক al চ্ছিক পরামিতিগুলির জন্য:

<Route path="/to/page/:pathParam1?/:pathParam2?" component={MyPage} />

নোট: প্রতিক্রিয়া রাউটার V4 হয় বেমানান সঙ্গেপ্রতিক্রিয়া-রাউটার-রিলে( এখানে আরও পড়ুন )। পরিবর্তে সংস্করণ v3 বা তার আগে (v2 প্রস্তাবিত) ব্যবহার করুন।

Comments

এটি এখনও ইউআরএল এর একাধিক /route(/:category/(:article)

— alচ্ছিক প্যারাম

@ অ্যালেক্সাওয়ার্ক, ভাল পয়েন্ট, ধন্যবাদ। আমি একাধিক alচ্ছিক পরামিতি প্রদর্শনের জন্য কোড যুক্ত করেছি। একবার দেখুন।

— ক্রিস

@ ক্রিস আমি নিশ্চিত, এটি এইভাবে কাজ করে না, আপনি এটি পরীক্ষা করেছেন?

— অ্যালেক্স শাওয়ার্ক

@ ক্রিস 3 সংস্করণ সহ

— অ্যালেক্স শোয়ার্ক

আমি কি প্রধান রুটের alচ্ছিক পথ পরম তৈরি করতে পারি? উদাহরণস্বরূপ, আমাকে পথটিতে ভাষা পরম যুক্ত করতে হবে এবং আমার হোমপৃষ্ঠাটি ইউআরএল "/" এবং "/ en" হবে এখানে ডেমো রয়েছে

— খোলিয়াভকো

Answer 2

কোনও অনুসন্ধানের পরে এখানে পৌঁছানো যে কোনও প্রতিক্রিয়া রাউটার ভি 4 ব্যবহারকারীদের জন্য, একটিতে optionচ্ছিক পরামিতিগুলি প্রত্যয় <Route>দিয়ে ?বোঝানো হয়েছে।

এখানে সম্পর্কিত ডকুমেন্টেশন:

https://reacttraining.com/react-router/web/api/Route/path-string

পথ: স্ট্রিং

কোনও বৈধ ইউআরএল পাথ যা পাথ-টু-রেজিপ্সপ বোঝে।

<Route path="/users/:id" component={User}/>

https://www.npmjs.com/package/path-to-regexp#optional

ঐচ্ছিক

প্যারামিটারটি alচ্ছিক করার জন্য প্যারামিটারগুলি একটি প্রশ্ন চিহ্ন (?) এর সাথে প্রত্যয়ী হতে পারে। এটি উপসর্গটিকে alচ্ছিকও করে তুলবে।

---

কোনও সাইটের নম্বরযুক্ত পৃষ্ঠাটির সহজ উদাহরণ যা পৃষ্ঠা নম্বর সহ বা ছাড়াই অ্যাক্সেস করা যায়।

<Route path="/section/:page?" component={Section} />

Comments

@ ব্যবহারকারী 2928231 ধন্যবাদ, তাদের নতুন ডক্স url সহ আপডেট হয়েছে। যতদূর আমি বলতে পারি <Match pattern />এখন <Route path />আবার, তবে প্রশ্ন চিহ্ন প্রত্যয়টি optionচ্ছিক প্যারামগুলি পরিচালনা করার জন্য এখন যোগাযোগ অবধি রয়ে গেছে।

— জন

ওহে! আমি এখনও ঐচ্ছিক প্যারামিটার একটি সমস্যা আছে এবং কাজ আগামী যাত্রাপথ করতে পারবেন না: আমি, players, players/123, players/123/edit, players?unseen=true। Alচ্ছিক পরামিতি ?unseenআমার পক্ষে কাজ করে না। যদিও আমি এই আলোচনা থেকে সমস্ত স্থির চেষ্টা করেছি। আপনি দয়া করে সঠিক পথের স্ট্রিংয়ে সহায়তা করতে পারেন, যা এটি পরিচালনা করবে? আগাম ধন্যবাদ!

— Khrystyna Skvarok

হাই, ক্রাইস্টাইনাস্ক্বারোক, আপনি কীভাবে আপনার পাথ ডাব্লু / একটি alচ্ছিক ক্যোয়ারিং স্ট্রিংয়ের সাথে কাজ করবেন তা কী খুঁজে পেয়েছেন? আমিও তাই করার চেষ্টা করছি

— সাবালিয়াও

@ সাব্লিয়াও হাই! আমার কোনও কাজের উদাহরণ নেই তবে URL এর মতো example.com/search?query=testপরবর্তী প্যাটার্নটি ব্যবহার করার চেষ্টা করুন /:search(search)।

— Khrystyna Skvarok

ডিলিমিটারের পরে আমি কীভাবে url থেকে প্যারাম পেতে পারি?

— পিএইচপি নিনজা

Answer 3

একাধিক alচ্ছিক প্যারামের জন্য সিনট্যাক্স কাজ করছে:

<Route path="/section/(page)?/:page?/(sort)?/:sort?" component={Section} />

এখন, ইউআরএল হতে পারে:

1. /অধ্যায়
2. / অধ্যায় / পৃষ্ঠা / 1
3. / অধ্যায় / পৃষ্ঠা / 1 / সাজানোর / উচ্চক্রমে

Answer 4

প্রতিক্রিয়া-রাউটার ভি 5 এবং একাধিক পাথের জন্য সিনট্যাক্সের নীচে ব্যবহারের জন্য

<Route
          exact
          path={[path1, path2]}
          component={component}
        />