Showing
1 changed file
with
17 additions
and
5 deletions
1 | # blk-wap项目中的一些注意点 | 1 | # blk-wap项目中的一些注意点 |
2 | 2 | ||
3 | -## 框架结构 | 3 | +## 1.框架结构 |
4 | 首先,我们先说一下blk-wap项目的架构,这样便于后面的人能够快速上手 | 4 | 首先,我们先说一下blk-wap项目的架构,这样便于后面的人能够快速上手 |
5 | 5 | ||
6 | 1. 服务端:node的express框架 | 6 | 1. 服务端:node的express框架 |
7 | 2. ui端:vue + gulp + webpack | 7 | 2. ui端:vue + gulp + webpack |
8 | 8 | ||
9 | -## 目录结构 | 9 | +## 2.目录结构 |
10 | 10 | ||
11 | apps: node服务端业务代码 | 11 | apps: node服务端业务代码 |
12 | 12 | ||
@@ -22,14 +22,14 @@ app.js: node服务入口文件 | @@ -22,14 +22,14 @@ app.js: node服务入口文件 | ||
22 | 22 | ||
23 | dispatch.js :路由分发文件 | 23 | dispatch.js :路由分发文件 |
24 | 24 | ||
25 | -## vue | 25 | +## 3.vue |
26 | 26 | ||
27 | 关于vue部分,如果不熟悉的话,大家可以查看一下官方文档 | 27 | 关于vue部分,如果不熟悉的话,大家可以查看一下官方文档 |
28 | http://cn.vuejs.org/guide/ | 28 | http://cn.vuejs.org/guide/ |
29 | 29 | ||
30 | 这里面主要是组件方面知识,用的比较多。 | 30 | 这里面主要是组件方面知识,用的比较多。 |
31 | 31 | ||
32 | -## 与app端的交互 | 32 | +## 4.与app端的交互 |
33 | 混合模式下,比较麻烦的地方是与app原生端的交互。因为有些业务处理需要app端配合处理。 | 33 | 混合模式下,比较麻烦的地方是与app原生端的交互。因为有些业务处理需要app端配合处理。 |
34 | 34 | ||
35 | 1. | 35 | 1. |
@@ -39,7 +39,7 @@ http://cn.vuejs.org/guide/ | @@ -39,7 +39,7 @@ http://cn.vuejs.org/guide/ | ||
39 | 2. | 39 | 2. |
40 | 监听app端事件参看:public/js/common/vue-bus.js文件,是通过一个全局的vue实例的on及emit来处理的。 | 40 | 监听app端事件参看:public/js/common/vue-bus.js文件,是通过一个全局的vue实例的on及emit来处理的。 |
41 | 41 | ||
42 | -## h5页面刷新 | 42 | +## 5.页面刷新 |
43 | 43 | ||
44 | 目前页面跳转时。有些场合下需要刷新页面,由于刷新的逻辑在每个页面都不同,所以app端很难来处理。没办法,只能由h5这边来做了。 | 44 | 目前页面跳转时。有些场合下需要刷新页面,由于刷新的逻辑在每个页面都不同,所以app端很难来处理。没办法,只能由h5这边来做了。 |
45 | 45 | ||
@@ -47,5 +47,17 @@ http://cn.vuejs.org/guide/ | @@ -47,5 +47,17 @@ http://cn.vuejs.org/guide/ | ||
47 | 我们目前的做法是通过localstroage来处理的,也就是yoho.js中的 store属性。 | 47 | 我们目前的做法是通过localstroage来处理的,也就是yoho.js中的 store属性。 |
48 | 如果,你有更好的想法,欢迎提出来。 | 48 | 如果,你有更好的想法,欢迎提出来。 |
49 | 49 | ||
50 | +## 6.开发中碰到的一些坑 | ||
50 | 51 | ||
52 | +前端开发,最大的一个坑莫过于适配不同的手机浏览器。混合模式下,这个问题稍微有些好转,因为我们会指定webview的版本号。 | ||
51 | 53 | ||
54 | +不过对于ios及android的区别,适配的工作量仍然很大。 | ||
55 | + | ||
56 | +我先列出我碰到的一些适配问题,欢迎补充 | ||
57 | +1. <input type='date'> 元素在ios和android的效果是完全不一样的(比如在ios中会显示年月日,在android中则是/)。而这个元素的可设置的属性也很有限。 | ||
58 | +于是只能用曲线救国的办法了, 在input元素下面方一个span,然后把input给背景透明,这样我们就可以通过改动span来显示我们想要的了(欢迎更好的解决方法) | ||
59 | + | ||
60 | +2. <select> 元素 在ios和android也是完全不一样,在ios中默认值如果未改变的话,是不会触发change事件的。所以目前的做法是在ios的选择项中多加一个默认值。 | ||
61 | +而android则不需要。目前的做法是会根据ua来判断是否是ios,来进行不同的处理 | ||
62 | + | ||
63 | +3. 目前blk-wap项目中的字体全部用的css,不要手动去写unicode码 |
-
Please register or login to post a comment