资讯专栏INFORMATION COLUMN

Vue.js仿一个购买火车票的app

lufficc / 916人阅读

摘要:项目地址预览的时候如果是用电脑预览的话请切换手机端预览地址源码地址欢迎点赞项目描述主要技术使用实现单页应用使用处理路由使用实现数据存储搜索历史使用存储实现手机端兼容一波小提示因为数据是我自己模拟的,存在里面,我只写了萍乡到南昌和上海到苏州的

项目地址

预览的时候如果是用电脑预览的话请切换手机端

预览地址

源码地址(欢迎点赞 <( ̄︶ ̄)>)

项目描述

主要技术

使用vue.js实现单页应用

使用vue Router处理路由

使用vuex实现数据存储

搜索历史使用localstorage存储

flexible实现手机端兼容

一波小提示

因为数据是我自己模拟的,存在easy mock里面,我只写了萍乡到南昌和上海到苏州的数据,体验的时候可以按照这个查询哦

页面功能

城市搜索,可以点击选择以及自己输入,并且把搜索历史保存在localstorage里面

日历组件,选择日期

对搜索的内容进行以出发时间,旅行耗时,所需票价进行不同情况的排序,

不同车次的筛选

购买车票,可以购买多张车票

显示购买的车票信息

来一波动态图展示




总结
虽然只是一个小的例子练习,但是一路踩坑过来,从中还是学到了很多东西,对vue vuex更加了解,逻辑思维也得到了了锻炼,只有在不断的练习中才能加固对知识的掌握,

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/83478.html

相关文章

  • 尤大低仿博客带回家

    摘要:你没有看错,只需几小时,低仿的尤大作者博客你带回家,有的小朋友可能注意到,为啥这里没说同款和高仿的原因是在还有一些其他的方面,都是简单的实现,我怕说了高仿之后,遭到板砖这样就不好了,现在看病也挺贵的。步骤如下首先登录阿里云控制台。 前言 就在上周六看到阿里云服务器搞一个活动,6元钱一年的共享虚拟主机。但是之前有使用过,觉得最蛋疼的地方是,它只给你开放一个ftp,而且权限上面也有一些控制...

    chanjarster 评论0 收藏0
  • 尤大低仿博客带回家

    摘要:你没有看错,只需几小时,低仿的尤大作者博客你带回家,有的小朋友可能注意到,为啥这里没说同款和高仿的原因是在还有一些其他的方面,都是简单的实现,我怕说了高仿之后,遭到板砖这样就不好了,现在看病也挺贵的。步骤如下首先登录阿里云控制台。 前言 就在上周六看到阿里云服务器搞一个活动,6元钱一年的共享虚拟主机。但是之前有使用过,觉得最蛋疼的地方是,它只给你开放一个ftp,而且权限上面也有一些控制...

    ztyzz 评论0 收藏0
  • 尤大低仿博客带回家

    摘要:你没有看错,只需几小时,低仿的尤大作者博客你带回家,有的小朋友可能注意到,为啥这里没说同款和高仿的原因是在还有一些其他的方面,都是简单的实现,我怕说了高仿之后,遭到板砖这样就不好了,现在看病也挺贵的。步骤如下首先登录阿里云控制台。 前言 就在上周六看到阿里云服务器搞一个活动,6元钱一年的共享虚拟主机。但是之前有使用过,觉得最蛋疼的地方是,它只给你开放一个ftp,而且权限上面也有一些控制...

    missonce 评论0 收藏0
  • Vue.js全家桶低仿网易云音乐(MacOS版) 已新增electron打包pc平台app

    摘要:项目地址暂时只实现了基本功能加了一点微小的效果主要适配浏览器对和做了一点微小的适配现在已经包括了打包平台的功能了源码地址项目预览项目描述前端部分整体加载进度懒加载模块的加载中提示实现了滑块增量分页新曲等使用了做单页应用使用了处理路由使用了管 项目地址 暂时只实现了基本功能 加了一点微?小的效果 主要适配pc浏览器 对android 和ios 做了一点微?小的适配 现在已经包括了ele...

    melody_lql 评论0 收藏0

发表评论

0条评论

lufficc

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<