vue 是否包含类似于 django 中的块功能

【问题标题】：Does vue contain blocks funcionality like in djagnovue 是否包含类似于 django 中的块功能
【发布时间】：2020-11-21 05:46:04
【问题描述】：

我正在开发新的网络项目。以前我将所有内容都保存在一个项目（django）中。这次我决定将它拆分为两个独立的项目——后端（django）和前端 vue。我没有使用原始 vue 项目，所以这是我的问题 - 我可以在 vue 中使用块吗？我的目标是为其他视图创建一个带有导航栏、页脚和中间 div 的主模板，就像在 django 块中一样。我可以在每个视图中导入这些组件，但它并不优雅，我敢打赌一定有其他解决方案。

【问题讨论】：

我会给你一个提示而不是一个完整的答案。使用 Vue 组件vuejs.org/v2/guide/components.html。组件 - 是关于您的 web-UI 的可重用部分，与 django 模板不等价甚至类似，但您也可以使用它将系统拆分为可管理的代码片段。

标签： django vue.js

【解决方案1】：

根据您的实现，如果在前端处理路由，您可以使用嵌套路由和类似的东西：

<html>

  ...

  <body>
     // code outside here

     // vue component taken from route
     <router-view></router-view>

    // more code outside here
  </body>

  ... 

</html>

你可以找到更多关于Vue路由器的信息here

或者，您可以为项目的其他部分创建一个带有插槽的基础组件：

<template>
    <div>
    
       <header-component></header-component>
    
       <div>
    
         <nav-component>
           <slot name="..."></slot>
         </nav-component>
    
         <main>
           <slot name="..."></slot>
         </main>
    
       </div>
    
    </div>
</template>

【讨论】：