webpack - 使用vue.js构建后台管理系统，如何实现类似easyUI多窗口的布局？

问题描述

问 题

如何使用vue.js 构建类似这样的后台管理系统，
主要是有不同的标签页面，可以关闭，传统的方式是iframe实现，
请问 使用vue.js 如何构建？是否使用iframe？
如果使用iframe如何构建？
如果不使用iframe，vue.js 如何构建实例？是一个面多个实例，还是组件之间的通信？
希望有大神能够提供一个大概的思路

解决方案

用vue框架无需使用iframe，
结合vue-router相关知识点，
左侧是一个固定不变的导航，
顶上我的桌面这一行也可以看成固定不变的导航，只不过它的条数是变动的，可通过重新打开页面，或者点击关闭来增加或减少条数，
中间部分根据页面变化不多说。
上一个例子，主要是主页面部分：

<template>
  <div id="app">
      <div class="header">头部</div>
      <div class="container">
        <Sidemenu>左侧导航</Sidemenu>
        <Submenu>顶部导航</Submenu>
        <div class="page">
            <router-view></router-view>
        </div>
      </div>
      <div class="footer">
          &copy;底部
      </div>
  </div>
</template>

顶部导航部分内容需要单独维护，上面说过，它是可变的。

这篇关于webpack - 使用vue.js构建后台管理系统，如何实现类似easyUI多窗口的布局？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！