मैं Blazor सर्वर-साइड का उपयोग कर रहा हूं।
जब Blazor App रिमोट सर्वर से डिस्कनेक्ट होता है, तो यह इसे दिखाएगा:
मैं ऊपर की छवि का पाठ बदलना चाहता हूं ('सर्वर से पुन: कनेक्ट नहीं हो सका ...' और इसी तरह)।
मैं इसे हमारे देश की भाषा में बदलना चाहता हूं।
मुझे प्रोजेक्ट की फाइल मिली लेकिन इस बारे में कुछ नहीं मिला।
मैं इसे बदलने में किस तरह सक्षम हूं? धन्यवाद।
जवाबों:
Blazor ऐप यह जांच करेगा कि क्या पेज में id के साथ html तत्व है{dialogId} :
class होगा:
components-reconnect-showसर्वर से पुन: कनेक्ट करने का प्रयास करते समय करें,components-reconnect-failedसर्वर से कनेक्ट करने में विफल होने पर करें।components-reconnect-refusedकि सर्वर सर्वर तक पहुंचता है वैसे ही सेट करें जब सर्वर कनेक्शन को सक्रिय रूप से खारिज कर देता हैडिफ़ॉल्ट रूप से, dialogIdहै components-reconnect-modal। इसलिए आप पृष्ठ में एक तत्व बना सकते हैं और अपनी इच्छानुसार सामग्री और शैलियों को नियंत्रित करने के लिए CSS का उपयोग कर सकते हैं।
उदाहरण के लिए, मैं प्रदर्शित करने के लिए सामग्री के तीन भाग बनाता हूं Pages/_Host.cshtml:
<div id="components-reconnect-modal" class="my-reconnect-modal components-reconnect-hide">
<div class="show">
<p>
This is the message when attempting to connect to server
</p>
</div>
<div class="failed">
<p>
This is the custom message when failing
</p>
</div>
<div class="refused">
<p>
This is the custom message when refused
</p>
</div>
</div>
<app>
@(await Html.RenderComponentAsync<App>(RenderMode.ServerPrerendered))
</app>
<script src="_framework/blazor.server.js"></script>और फिर शैली को नियंत्रित करने के लिए कुछ CSS जोड़ते हैं:
<style>
.my-reconnect-modal > div{
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1000;
overflow: hidden;
background-color: #fff;
opacity: 0.8;
text-align: center;
font-weight: bold;
}
.components-reconnect-hide > div
{
display: none;
}
.components-reconnect-show > div
{
display: none;
}
.components-reconnect-show > .show
{
display: block;
}
.components-reconnect-failed > div
{
display: none;
}
.components-reconnect-failed > .failed
{
display: block;
}
.components-reconnect-refused >div
{
display: none;
}
.components-reconnect-refused > .refused
{
display: block;
}
</style>अंत में, हमें कनेक्ट करने का प्रयास करते समय या कनेक्ट करने में विफल होने पर निम्न संदेश मिलेगा:
चीजों के जावास्क्रिप्ट पक्ष के लिए ब्लेज़र एक छोटे से एपीआई को उजागर करता है window.Blazor वस्तु के ।
इस एपीआई का एक हिस्सा है defaultReconnectionHandler जो आपको पुनरावर्तन अनुभव को अनुकूलित करने की अनुमति देता जिसमें रिट्रीस आदि की संख्या के लिए अलग-अलग विकल्प सेट करना शामिल है।
हालाँकि, यह केवल प्रदर्शित करने के लिए तर्क को स्वैप करना भी संभव है ReconnectionDisplay
एक साधारण इम्प्लांटेशन इस तरह दिखता है और आपको इस प्रक्रिया पर नियंत्रण पाने में सक्षम बनाता है:
function createOwnDisplay() {
return {
show: () => { alert("put code that shows a toast , ui, or whaterver here"); },
hide: () => { console.log('foo'); },
failed: () => { console.log('foo'); },
rejected: () => { console.log('foo'); }
};
}
Blazor.defaultReconnectionHandler._reconnectionDisplay = createOwnDisplay();