在学习了之前的路由vue-router和状态管理vuex之后，就应该是网络交互了。就学习尤大推荐的axios了。刚好本人对网络请求这块除了会get、put、post和delete这四个方法之外知之甚少，刚好补全上。 注意：Vue官方推荐的网络通信库不再是vue-resource了，推荐使用axios。 axios安装npm:$ npm install axios bower:$ bower install axios Using cdn:<script src="https://unpkg.com/axios/dist/axios.min.js"></ ...
巧用jQuery选择器写表单办法总结（提高效率）
发表于
|
更新于
相信很多小伙伴都会遇到需要做表单的需求，就像我现在做的医院项目，茫茫多的表单无穷无尽。一开始做表单使用最笨的方法：一个个span去定义ID，每个数据都用ajax获取后赋值显示，然后在表单提交前一个个用jQuery根据ID获取元素的value，组成一个model来提交给服务器。后来发现使用jQuery可以大大简化这个过程。于是我修改了工作方法，总结了我的一些提高写表单效率的方法。 需求表单中存在最多的无非就是文本、文本框、单选框、多选框。而一些表单中会有几十个甚至几百个选项。我们的目标就是以最高的效率来完成这些表单的数据获取和数据提交。注意：如果元素ID和服务器上获取的json字段的名字是一 ...
Vue.js学习系列二 —— vuex学习实践笔记（附DEMO）
发表于
|
更新于
上次学习了vue-router的使用，让我能够在各个页面间切换，将页面搭建了起来。这次则要学习vue的状态管理模式——vuex。 注：本文只是个人对vuex学习的一些理解，要深刻掌握还需要认真查阅官方文档。 一、基本介绍Vuex 是一个专为 Vue.js 的SPA单页组件化应用程序开发的状态管理模式插件。由于Vue SPA应用的模块化，每个组件都有它各自的数据(state)、界面(view)、和方法(actions)。这些数据、界面和方法分布在各个组件中，当项目内容变得越来越多时，每个组件中的状态会变得很难管理。这是vuex就派上用场啦~下面我们看一个简单的vuex例子。 1. 单个组件中 ...
Vue.js学习系列一 —— vue-router2学习实践笔记（附DEMO）
发表于
|
更新于
想学习Vue的SPA应用，路由这一块是必不可少的。相信很多和我一样刚接触前端的朋友对于路由这玩意是很困惑的。所以在我学习并成功使用了 vue-router 后，将我的个人经验分享出来，希望可以让同样对路由不知所措的同学有所帮助。 注意： 本文demo的项目结构用的是最新的命令行工具创建的webpack项目模板； 本文知识点是基于Vue2.0和vue-route 2的，更多内容请参考Vue.js官网和vue-router 2官方文档： 一、路由的安装：npm安装可以使用npm直接安装插件npm install vue-router --save 执行命令完成vue-router的安装，并在 ...
weex 踩坑记（持续更新中……）
发表于
|
更新于
消失了一个月，努力为新项目倒腾 weex 中，记录一下遇到的问题。之后还会持续更新~ 目前，我使用的 weex 都是在集成Weex到Android来做的，项目使用的是 weex-toolkit 生成的项目模板，代码发布使用webpack打包成js放到服务器上，Android端读取服务器上的js来实现weex项目的。 杂七杂八的一些知识点 屏幕宽度为 750，高度一直没查到，我用的是1300，刚好显示下。长度单位要么不写，要么就是 px，效果都一样。 .item { height: 1300; width: 750px;} 布局只支持 盒子模型、flex布局、rel ...
Weex控制Android返回键解决方案
发表于
|
更新于
正在深入倒腾weex，希望可以将weex用在项目中。这里找出了weex控制Android返回键的方法。 需求项目使用的是Vue+VueRouter的单页应用来写Weex的，现有以下需求。 当页面不在首页上时，返回上一页面。 this.$router.go(-1) 当页面在首页是，关闭当前Android应用 解决方案Android和Weex的通信Android to Weex使用的是globalEvent来实现的。我们在 Android 的返回按钮事件中触发 globalEvent，在 Weex 中监听该 globalEvent。 Androidpublic void onBackPre ...
将表单从jQuery转Vue框架实践总结
发表于
|
更新于
工作需要，将公司项目从jQuery转成Vue来写。这里分享下转变项目的过程并写了一个小demo，希望能对遇到同样问题的朋友一些帮助。PS： 本人Android开发，兼职前端，前端知识浅薄，有什么不对的地方还请指出，大家共同进步。谢谢~由于代码较多，我把源码放在了博客最后了。 jQuery和Vue的区别jQuery是使用选择器（$）选取DOM对象，对其进行赋值、取值、事件绑定等操作，其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象，而数据和界面是在一起的。比如需要获取label标签的内容：$("lable").val();,它还是依赖DOM元素的值。Vue ...