类似像这样的后台管理系统是如何实现的呢？

Question

类似这样的后台管理系统，我们通过点击左侧的菜单来实现右边内容的切换，那么在不使用框架的前提下这是如何实现将右侧的不同内容载入进来哦呢？是一开始就写死的吗？

Answer 1

1. iframe引入

2. ajax引入html再写到页面上

3. 各大单页应用框架 vue react angular。然后还有一些引入资源的框架呀啥的

Answer 2

首先单页应用还是的推荐使用框架，如果确定不使用框架的话 右侧通过iframe来加载 也是方法之一， 实在不行就用div 或者ul li 模拟，不过这样的话，需要把每一栏 做成一个li 并且事先需要把css 和html 写好，点击左侧的时候去请求数据填充进li。

Answer 3

楼主我告诉你，看了好多这种系统源码。既不是单页面应用、也不是iframe 。每个页面都是一个完整的（包括左侧菜单导航。。）

Answer 4

利用ajax局部刷新。

Answer 5

模板引擎或者iframe

Answer 6

iview-admin,你可以了解一下是vue的前端框架项目，iView 发布后台管理系统 iview-admin

Answer 7

通过iframe 将网页分为三块 左侧点击切换右侧其实就是超链接

Answer 8

不是说iframe什么的不好吗 大家怎么还都在用 （迷茫不懂）

Answer 9

在不使用框架的前提下就是iframe
<iframe scrolling="yes" frameborder="0" :src="main"></iframe>
我以前的一个项目就是这么弄的，用了Vue做双向数据绑定，
点击左侧触发updated就改变main(当时用的是Vue1.0)

Answer 10

如果在不用框架的基础上，你可以这样操作，在你现在的这个页面上面定义一个主方法，在你每一次点击左侧菜单的时候，通过ajax或者其他的异步方式，去后台拿对应的模板页面，然后渲染在右侧区域，还有另一种方式就是不用这种异步加载，通过左侧的菜单地址直接去后台拿对应的模板数据来渲染，很多富客户端也都是用异步加载这种方式，体验相对会比较好一点。