爱意满满的作品展示区。
yuanfnadi

后端程序员用 Vue 写的导航页面

  •  
  •   yuanfnadi · Mar 6, 2018 · 4768 views
    This topic created in 3005 days ago, the information mentioned may be changed or developed.

    demo

    优点: 纯静态。

    所以的图片使用 SVG。整个页面用 webpack 打包。包括全部图标仅仅 150kb。

    可以配置一个 yml 就可以自动的生成整个 HTML,再也不用重复性的写 HTML。

    已经写好 Dockerfile 打包放入 nginx 容器。仅仅 16.4MB 。

    https://github.com/DiamondYuan/diamond-navigation

    Supplement 1  ·  Mar 8, 2018
    用了微信的 weui+vue 的 v-for。一下子就搞完了移动端的页面。
    不得不说。vue 真的是超级好用。太适合后端狗了。一下子就可以搞一个自己看得下去的移动网站。
    20 replies    2018-03-08 14:38:58 +08:00
    yuanfnadi
        1
    yuanfnadi  
    OP
       Mar 6, 2018
    https://github.com/geekape/geek-navigation

    类似于整个项目。但是不需要手动写 HTML。只需要改一下 yml 文件就可以了。
    fangch
        2
    fangch  
       Mar 7, 2018 via iPhone
    有人收藏 没有人评论说支持一波👍
    wspsxing
        3
    wspsxing  
       Mar 7, 2018
    我也写了个导航,也是 Vue 实现(最初是原生 js),静态的可以编辑并导入导出 json 配置的简单页面(css 苦手)。
    挂在 Github Page 上就开始用了: https://biluohc.github.io/Cloud-home-Page/#/
    Github: https://github.com/biluohc/Cloud-home-Page

    多谢楼主的想法,看了楼主的后感觉可以加一个书签的页面,然后用侧栏分类。
    wspsxing
        4
    wspsxing  
       Mar 7, 2018
    对了,我没有适配移动端,uc 目前显示的勉强可以看,其它的我不知道 QAQ.
    ixx
        5
    ixx  
       Mar 7, 2018
    @wspsxing 看你的想法应该和我有类似需求推荐看一下 [简页]( http://jianpage.com) http://jianpage.com
    ixx
        6
    ixx  
       Mar 7, 2018
    Demo 地址打不开 看了 github 里的介绍样子和 创造狮导航很像
    wspsxing
        7
    wspsxing  
       Mar 7, 2018 via Android
    @ixx 嗯,多谢啦。
    请问这个定制的是要注册吗?然后要不要付费?然后可用性依赖你的服务器?
    notreami
        8
    notreami  
       Mar 7, 2018
    导航,我更喜欢,直接 js,jquery 都不用
    yuanfnadi
        9
    yuanfnadi  
    OP
       Mar 8, 2018
    @wspsxing 你可以看一下我现在的移动端。喜欢的话自己改一下 yml 就好了。
    wspsxing
        10
    wspsxing  
       Mar 8, 2018 via Android
    @yuanfnadi 嗯,感谢,等以后有空 copy 下布局,哈哈。其实我觉得那个简页的移动端布局不错,相对移动端的小屏幕紧凑实用。
    我是个标准的选择强迫症,三大框架都入门了,最开始是 angular,然后是 react,最后是 vue。angular 就体积太大了,移动端加载慢,感觉是还可以,react 的 redux 思想听起来还不错,然而用起来艹蛋的很,一旦使用了,你写的 react 应用重心偏移,噪声巨大,而且我非常怀疑这种手动分发字符串 key 的效率(反正知乎移动端在我这破手机上滚动不时卡的一动不动),代码大部分都是它相关的,还有 n 种异步 redux 中间件,恶心的要死,彻底弃坑,我从里面学到了生命周期钩子,单项数据流,redux 的概念。最后是 vue,感觉是某种程度上的取二者之长,既可以双向绑定,又有生命周期,又有 rederFunction,vuex,体积也占优。另外感觉 cycle.js 也不错,mvi 模型非常纯净易懂,问题是也是手动分发 key。
    wspsxing
        11
    wspsxing  
       Mar 8, 2018 via Android
    以上是我这后端对前端的浅薄思考。
    另外感觉不少坑都是 js 的,因为 js 的某些特性,代码写的怪怪的(比如对象深拷贝,vue 更新数组)。。
    HELLONAV
        12
    HELLONAV  
       Mar 8, 2018 via Android
    厉害了我的哥
    17xh2
        13
    17xh2  
       Mar 8, 2018
    Star & Fork & Follow
    哇 拉拉人
    Heanes
        14
    Heanes  
       Mar 8, 2018
    厉害了,我也在加强前端
    ixx
        15
    ixx  
       Mar 8, 2018
    @wspsxing 定制需要注册,不收费,因为会存储数据所以会有部分功能依赖后台服务器
    HELLONAV
        16
    HELLONAV  
       Mar 8, 2018 via Android
    @MrRabbit 拉拉人是什么鬼
    yuanfnadi
        17
    yuanfnadi  
    OP
       Mar 8, 2018
    @HELLONAV ller。看我头像
    HELLONAV
        18
    HELLONAV  
       Mar 8, 2018 via Android
    @yuanfnadi 原来如此,看来我老了
    HELLONAV
        19
    HELLONAV  
       Mar 8, 2018 via Android
    你那个 wiki 的我打开为什么提示疑似木马!!!
    deletemyself
        20
    deletemyself  
       Mar 8, 2018
    类似 ZBuilder?
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2696 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 42ms · UTC 15:41 · PVG 23:41 · LAX 08:41 · JFK 11:41
    ♥ Do have faith in what you're doing.