(转)一个基于vue2的天气js应用
2024-08-28 11:13:39
基于vue.js 2.0的百度天气应用
vue-weather
基于vue.js 2.0的百度天气应用。
说明
初学vue,在看完一个简单的视频教程和走两遍完官方文档之后仍然感觉云里雾里,知其然不知其所以然(虽然现在好了点)。请教了高手之后人家都说学习新东西的最好方法不就是学到了之后就要用么。边学边用,根据项目需要学才是最快上手的,但有没有什么适合新手的项目参考,想了几天打算用vue来仿一个简单的天气应用,于是就出现了这个小应用,巩固所学。项目适合刚学完vue想实践的新手,高手略过吧!
技术栈
- vue2.0
- vue-router
- webpack
- ES6/7
- Axios
- less
- linq.js
- svg
运行环境
nodejs 6.0 稳定版 npm 3.10
安装
git clone https://github.com/alanWongsGithub/vue-weather.git cd weather/ npm install
运行
npm run dev
上线
npm run build
然后
本项目用于刚上手vue 2.0文档想找项目尝尝鲜的coder。
由于本人也刚接触vue所以在您看来可能代码写的有些乱,将就着看吧。
项目使用百度IP定位API获取当前城市,再根据当前城市获取中国天气网天气API信息,百度的IP定位API需要自己注册开发者账号然后申请一个AK密钥,然后才能获取定位信息,当然也可以手动设置当前城市天气。
由于使用的免费天气API数据过于简单,导致某些功能只能自己实现或者未开发,比如日落日出时间,当然也可以计算自己实现,稍复杂。
国际惯例,您觉得还可以就 star一下吧,让我更有动力学习。
开发环境为 windows 7 Chrome 57 node 6.10.1。
实现功能
效果截屏
主界面
界面功能
城市列表
城市列表选择设置
八种纯CSS天气图标
最新文章
- JSONP跨域处理实例
- zabbix 客户端的安装
- 使用pm2常见问题
- ionic2 页面加载时图片添加的问题
- 【BZOJ 1412】[ZJOI2009]狼和羊的故事
- #python基础学习模块:marshal 对象的序列化
- List myList=new ArrayList()的理解
- 【Git】代码托管-从基本设置开始
- WPF Media 简单的播放器
- MongoDB入门命令
- SQLServer中的CTE通用表表达式
- JS——按钮点击事件累加注册问题
- Linux 权限位详解
- ubuntu系统下Python虚拟环境的安装和使用
- Jenkins 构建运行java程序
- Git 版本控制管理(二)
- cmd重启服务器,有时不想去机房,并且远程桌面连接登录不上了
- cmd下命令提示符下杀进程主要有三种方法
- 简单可行的code review规则
- BZOJ.2716.[Violet3]天使玩偶(K-D Tree)
热门文章
- 本人博客已经搬至SegmentFault.com
- 不同版本的jquery的复选框checkbox的相关问题
- Shiro源码分析之Subject和SecurityManager
- 在sublime Text 3上编写并运行java程序
- 洛谷——P2952 [USACO09OPEN]牛线Cow Line
- JZYZOJ 1360 [usaco2011feb]人品问题 DP 树状数组 离散化
- [Contest20171005]Maze
- [JZOJ5426]摘Galo
- bzoj 1636: [Usaco2007 Jan]Balanced Lineup -- 线段树
- 简单的INI解析封装