首页 > 关于vuejs动态组件问题

关于vuejs动态组件问题

我们想做一个类似阿里云邮箱这样页签的功能,发现用路由实现并不合适。先看一下图片,

如图:第一个tab是不动的,根据选择邮件,联系人,日程,云盘进行切换,是切换第一个tab里面的内容,假如我单击新建邮件,会出现一个新的tab(new message), 再单击新建邮件,又会出现一个新的tab,那么内容区域也会切换到相应的tab,每个tab里的内容都是独立的不同的。
这个是路由无法实现的,请问有好的办法能实现这个功能吗?


专门上去研究了一下,发现这是一个奇妙的黑科技。
感觉他们是自己开发了一套轮子,每一个tab下的page都相当于一个独立的app,有独立的状态。
然后你看他的地址,是h=${hash}。那个hash值(估计是base64)应该是可以转换为一个状态码的。
然后再看一个收件箱的两封邮件,发现hash的前一部分不变,后面变了。


我觉得做多page是基本能力了。
难的是,其中一个page还想采用路由。

我估计可以重新开发一套vue-router的轮子了。
要不,你问问 http://weibo.com/arttechdesign


實現過類似功能,可以這樣想:

藍框和綠框都是 <route-view>
藍框是由左邊的郵件聯繫人之類的控制,
綠框則是由上方的 Tab 控制
這個功能在 vue-router 是可以實現的,詳細請看:嵌套路由

而多個 NewMessage 的效果其實想簡單點就是個數組存放著所有 NewMessage 也許是用索引,或是生成個隨機的 id 來當識別。

點擊對應的 NewMessage 就是從數組中取出相對應的數據塞進去而已。
而這裡也可以靠 vue-router 的鉤子函數來實現: data

等等下班來寫個簡單版本的。

【热门文章】
【热门文章】