मैं अपने वेब एप्लिकेशन में Vuetify का उपयोग करता हूं। संपूर्ण वेब एप्लिकेशन उत्तरदायी है। मुझे समस्या है कि छोटी स्क्रीन (स्मार्टफोन, पैड) पर मैं वेबसाइट को ज़ूम आउट कर सकता हूं जिसका मतलब है कि मेरी वेबसाइट के दाईं ओर एक सफेद जगह है।

मुझे नहीं पता कि यह कैसे हो सकता है और यह मेरे वेब एप्लिकेशन के हर एक पेज में है। मैं ऐसा क्या कर सकता हूं जिसका उपयोग मैं पूरी जगह शुरू से करता हूं और उपयोगकर्ता वेबसाइट से ज़ूम आउट नहीं कर सकता है और बाईं ओर यह सफेद स्थान प्राप्त करता है?

एक संक्षिप्त उदाहरण के नीचे:

<template>
  <v-app>
    <v-main>
      <v-container>
        <v-row justify="center" align="center">
          <v-col cols="12" xs="10" sm="10" md="10" lg="10" xl="10">
            TEST_COL
          </v-col>
        </v-row>
      </v-container>
    </v-main>
  </v-app>
</template>


<script>

  export default {
    data: () => ({  
    }),
  }

</script>

<style>
</style>

हो सकता है कि समस्या App.vue फ़ाइल में हो, लेकिन मुझे वहां कोई समस्या नहीं दिख रही है। यह सुनिश्चित करने के लिए कि मैं नीचे app.vue पोस्ट करता हूं:

<template>
  <v-app>
    <Navbar />
    <v-main>
      <router-view></router-view>
    </v-main>
    <Footer />
  </v-app>
</template>

मैंने नीचे दो स्क्रीनशॉट दिए हैं ताकि आप देख सकें कि मेरा क्या मतलब है।

धन्यवाद! क्रिस

enter image description here

0
Chris 30 पद 2020, 18:18
क्या आप ग्रिड सिस्टम का उपयोग कर रहे हैं? v-main, v-container, v-row और v-col। क्या आप प्रश्न में कोड जोड़ सकते हैं?
 – 
Irwin
30 पद 2020, 18:25

1 उत्तर

सबसे बढ़िया उत्तर

मुझे जवाब मिल गया। मैंने ड्रॉअर ऑब्जेक्ट बनाने के लिए Vuetify द्वारा प्रदान किए गए <v-navigation-drawer> का उपयोग किया। मैंने निम्नलिखित विकल्पों का उपयोग किया:

<v-navigation-drawer v-model="drawer" absolute temporary right>

लेकिन निरपेक्ष का अर्थ है "स्थिति लागू करता है: घटक के लिए पूर्ण।" जिसका मतलब है कि यह वेबसाइट में अतिरिक्त जगह लेता है। विकल्प "पूर्ण" के बजाय "निश्चित" होना चाहिए तो यह काम करता है।

अच्छी सेटिंग्स हैं:

<v-navigation-drawer v-model="drawer" fixed temporary right>

अब दराज वेबसाइट के दाईं ओर खुलती है (स्मार्टफोन के लिए बेहतर) और यह कोई पूर्ण स्थान नहीं लेता है !!

0
Chris 30 पद 2020, 19:33