当使用路由器视图加载时,组件自动地用附加的v-container包装



我在这里写作,因为我找不到答案,或者更好的是,我发现自己无法提出合适的问题来找到答案。我的问题是:

给定App.vue结构:(简化(

<v-main>
<v-container fluid fill-height>
<router-view />
</v-container>
</v-main>

和Component.vue结构:

<v-row>
<v-col>
Component Content
</v-col>
</v-row>

为什么使用普通<v-container>包裹渲染组件?:

<main class="v-main" style="padding: 64px 0px 0px;">
<div class="v-main__wrap">
<div class="container container--fluid fill-height"> // App.vue
<div class="container">  // ????
<div class="row"> // component code
<div class="col">

它是某种秘密的vue-router还是vuetify模板?有人能解释为什么会发生这种情况吗?如果有办法避免的话?

编辑:版本:

Dependencies:
req:    inst:
core-js      ^3.8.3  3.21.1  
vue          ^2.6.14 2.6.14  
vue-router   ^3.5.1  3.5.3   
vuetify      ^2.6.0  2.6.4   
vuex         ^3.6.2  3.6.2   
Dev dependencies:
req:        inst:
@babel/core             ^7.12.16    7.17.7
@babel/eslint-parser    ^7.12.16    7.17.0  
@vue/cli-plugin-babel   ~5.0.0      5.0.3   
@vue/cli-plugin-eslint  ~5.0.0      5.0.3   
@vue/cli-plugin-router  ~5.0.0      5.0.3   
@vue/cli-plugin-vuex    ~5.0.0      5.0.3   
@vue/cli-service        ~5.0.0      5.0.3   
eslint                  ^7.32.0     7.32.0  
eslint-plugin-vue       ^8.0.3      8.5.0   
sass                    ~1.32.0     1.32.13 
sass-loader             ^10.0.0     10.2.1  
vue-cli-plugin-vuetify  ^2.4.7      2.4.7   
vue-template-compiler   ^2.6.14     2.6.14  
vuetify-loader          ^1.7.0      1.7.3   

好吧,糟糕的是,我没有意识到这是因为这个特定子视图<v-container>的父组件没有标记为流体。现在全部修复。由于父级只是一个带有容器和路由器视图的模板,没有任何逻辑,我完全忘记了它

相关内容

  • 没有找到相关文章

最新更新