1、弹出遮罩层后禁止滚动效果： 或  或  （亲测有效）

body,html 的 overflow: hidden; 就可以了

2、js获取图片的主题色c插件 rgbaster.js  ： （亲测有效） 或 

3、JS删除上一条浏览器历史记录的方法 ：  （使用 location.replace 把当前的url替换掉，相当于删除了当前的url记录）

　　或  

4、（这里研究Vue中的实现）跳转下一个页面，点击 浏览器返回按钮 再返回上一个页面，上一个页面数据不变。 

　  说明：这个用户体验是很重要的，比如，一个很长的产品列表页，点击进入详情页。返回产品列表页时，重新刷新的话，

　　　　  客户又得从头开始下拉去找到之前看过的那个产品，继续往下看其它的产品。（如果返回产品列表页时，还是进入产品详情页前的那个产品列表页，用户体验会非常好）

 　实现：这种需求的实现 还是使用vue自带的  keep-alive 组件进行来实现。具体实现可以  参考 

//所有商铺列表页        {            path: '/msite',            component: msite,            meta: { keepAlive: true }, // 需要缓存起来的组件在这设置        },        //特色商铺列表页        {            path: '/food',            component: food        },

 　　keep-alive实践总结 参考：

5、很长的列表（如产品列表），拉到下面，需要有一个 回到顶部  的按钮。  

6、进入页面时，数据没有请求完成，灰底背景 占位。两种实现

　　a、使用 vue-occupy 插件实现。 （不推荐，这种方式，每个动态显示数据的标签都需要额外添加属性）

　　b、使用 与页面相同结构的图片 先占位显示。 就是通过这种方法实现的，使用  svg图片 代替  整块DOM结构。

　　　（可以通过一些工具实现svg图片代码，如  可以 直接生成 svg文件。也可以使用png图片，淘宝是通过png图片实现的，有彩色）

                                    

 

7、

 

 

 

 

 

n、H5 页面要实现分享 的功能 是通过跳链接实现的，把当前页面的 url 作为一个参数传递给分享的链接。 

　  没有分享链接的平台（如 微信，通过生成一个二维码，进入微信平台分享）

 

 

---

 

实际开发中 需要 考虑的问题：

1、实际稿上是所有的数据，和内容都是有的。但是用户使用时，页面上有的内容如果是通过后台配置的，这个时候需要考虑，配置的这块内容的 字数多少 或 图片有无。

　  必须项（这个是可以在后管中规定好的）：基本就是考虑文字的多少、和图片的大小。

　  非必须项：就要  考虑文字或、图片 没有的时候  是否影响页面布局。

2、图片(背景图也一样)要设置 宽高，不能只是设置一个宽度。因为设计稿上图片，在H5页面中是通过后台上传的，后台上传的图片和设计稿上是图片不一定会是一样的宽高的。

　   即使上传的是一样的，但是在传送过程，压缩图片，都会存在宽（或高）相差几个像素的问题。相差几个像素进行拉伸是不会变形很大的（几像素的拉伸，用户是看不出来变形的）。