用 vue.js 开发微信 app(ios 版) 界面的 demo
来源:互联网 发布:mysql的string转date 编辑:程序博客网 时间:2024/05/16 05:54
vue-wechat
用vue.js开发微信app(ios版)界面的demo
线上地址: vue-wechat.github.io
因为github.io的限制,每次访问的入口都应是从主页( vue-wechat.github.io )访问,不要刷新。
安装
# install dependenciescnpm install# serve with hot reload at localhost:8080npm run dev# build for production with minificationnpm run build
技术栈
此demo在技术使用上以下技术的部分语法
- vue
- vuex
- vue-cli
- vue-router
- vue-toutch
- vue-animated-list
- weui
- zepto
fastclick
为了减少图片加载,图标使用的iconfont,
手机预览(QR)
如微信扫码浏览空白,请 点击右上角-> 浏览器 打开加载略慢,建议clone本地预览
基本操作
chat 页
页面切换,动画过渡 (仿照ios系统切换风格:下一页打开时,当前页左偏移-30%;当前页关闭时,上一页左偏移从-30%过渡到0%)
消息列表 (未读/已读)操作 及 删除
发现-朋友圈
发现-扫一扫
开发约定
所有组件.vue名 都统一 《短横线》 命名 css内下划线( _ )开始的为通用类 js中内下划线( _ )开头的为私有属性 所有events均使用短横线 命名 所有组件(.vue)里template标签包含的元素必须是component-xx 开头 所有state统一下划线 命名 所有 action统一下划线命名
参考
Vue-cnodejs
vue-zhihu-daily
vue-mobile-qq
vue-shopping
1 1
- 用 vue.js 开发微信 app(ios 版) 界面的 demo
- 用 vue.js 开发微信 app(ios 版) 界面的 demo
- 用Vue.js开发一个电影App的前端界面
- Vue.js模拟微信朋友圈开发demo
- 基于vue.js开发的demo—天气APP
- ios模仿微信的"我"界面的demo
- 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app
- 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app
- 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app
- 类似于微信通讯录的界面Demo
- 类似于微信通讯录的界面Demo
- iOS 类似微信,QQ聊天界面的气泡聊天简单实现Demo
- iOS 类似微信,QQ聊天界面的气泡聊天简单实现Demo
- Vue.js的helloworld-demo
- require.js+vue+vue-router+vue-resource开发微信上传图片组件
- Vue.js模拟微信朋友圈开发实录
- vue.js开发外卖App项目的内容总结(四)
- 微信开发DEMO
- JAVA万年历
- 使用webview
- Hibernate错误
- MySQL-Hibernate-SpringMVC开发初探
- Numpy数组的保存与读取
- 用 vue.js 开发微信 app(ios 版) 界面的 demo
- HTML 解析器---Jsoup学习笔记
- LeetCode 387. First Unique Character in a String 解题报告
- python之条件、循环语句
- AndroidManifest.xml文件解析
- 网络请求之RestFul
- 【openCV】特征点提取与匹
- 翻纸
- Android UI(ToggleButton)详解