Vue: ssr अनपेक्षित हाइड्रेशन खैरात

को निर्मित 28 जून 2017 · 4टिप्पणियाँ · स्रोत: vuejs/vue

संस्करण

2.3.4

प्रजनन

यहाँ F5 (पुनः लोड) कुंजी पर क्या होता है:
ssr_pre_tag_issue
(यह केवल एक बार होता है, वीडियो लूप किया जाता है)

प्रजनन करने कि प्रक्रिया

vue-hackernews-2.0 डेमो के App.vue में <pre> टैग जोड़ें:

<template>
  <div id="app">
    <header class="header">
    <pre style="background-color: #aaa">
foobar
    </pre>
      <nav class="inner">

क्या अपेक्षित है?

<pre> टैग के लिए क्लाइंट-साइड और सर्वर-साइड का एक ही संस्करण है

वास्तव में क्या हो रहा है?

क्लाइंट और सर्वर साइड संस्करण समान नहीं हैं, तो खैरात?, फिर <pre> टैग सामग्री टिमटिमा रही है

bug

स्रोत

FranckFreiburger

सबसे उपयोगी टिप्पणी

@FranckFreiburger यह एक बग प्रतीत होता है। विनिर्देश के अनुसार https://www.w3.org/TR/html5/syntax.html#element -restrictions

प्री और टेक्सटेरिया एलिमेंट्स के स्टार्ट टैग के तुरंत बाद एक सिंगल न्यूलाइन लगाई जा सकती है। यदि तत्व की सामग्री को एक नई पंक्ति से शुरू करने का इरादा है, तो लेखक द्वारा लगातार दो नई पंक्तियों को शामिल करने की आवश्यकता है।

प्री टैग के तुरंत बाद first लाइन ब्रेक को नजरअंदाज कर दिया जाता है, जबकि vue html कंपाइलर नहीं लगता है।

मैं इसे ठीक करने की कोशिश करूंगा।

defcc 3 जुल॰ 2017

👍3

सभी 4 टिप्पणियाँ

धन्यवाद @FranckFreiburger , मैं मैक और विंडोज़ पर इस मुद्दे को पुन: पेश करने का प्रयास करता हूं, दोनों ठीक हैं। क्या आप कृपया अधिक जानकारी प्रदान करेंगे? और F5 key , पृष्ठ को फिर से लोड करने के लिए F5 से आपका क्या मतलब है?

defcc 1 जुल॰ 2017

विंडोज 7, नोड v8.1.2, नवीनतम Google क्रोम और फ़ायरफ़ॉक्स के साथ परीक्षण किया गया।
vue-hackernews-2.0 डेमो को क्लोन करने के बाद, मैंने App.vue को <pre> टैग जोड़ने के लिए अभी संशोधित किया है।
फिर मैं npm run dev चलाता हूं, और पहली बार पृष्ठ लोड होने पर, समस्या होती है (और पृष्ठ पुनः लोड होने पर समस्या फिर से होती है)

गूगल देव टूल्स का उपयोग करना,
जब मैं समस्या से ठीक पहले स्क्रिप्ट निष्पादन को रोकता हूं, तो मार्कअप (देव उपकरण तत्व टैब में) होता है:

<pre style="background-color:#aaa;">foobar
        </pre>

जब मैं स्क्रिप्ट निष्पादन जारी रखता हूं, तो मार्कअप बन जाता है:

<pre style="background-color:#aaa;">
foobar
        </pre>

नेटवर्क टैब से डेटा सही लगता है, प्रारंभिक HTTP GET अनुरोध में शामिल हैं:

<pre style="background-color:#aaa;">
foobar
        </pre>

ध्यान दें: इस मुद्दे के साथ होता है नहीं करता है <div style="white-space:pre;"> के बजाय <pre>

FranckFreiburger 1 जुल॰ 2017

धन्यवाद, समझ गया। मैं इसे देखने की कोशिश कर रहा हूं।

defcc 3 जुल॰ 2017

प्री और टेक्सटेरिया एलिमेंट्स के स्टार्ट टैग के तुरंत बाद एक सिंगल न्यूलाइन लगाई जा सकती है। यदि तत्व की सामग्री को एक नई पंक्ति से शुरू करने का इरादा है, तो लेखक द्वारा लगातार दो नई पंक्तियों को शामिल करने की आवश्यकता है।

मैं इसे ठीक करने की कोशिश करूंगा।

defcc 3 जुल॰ 2017

👍3

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

Vue: ssr अनपेक्षित हाइड्रेशन खैरात

संस्करण

प्रजनन

प्रजनन करने कि प्रक्रिया

क्या अपेक्षित है?

वास्तव में क्या हो रहा है?

सबसे उपयोगी टिप्पणी

सभी 4 टिप्पणियाँ

संबंधित मुद्दों