移动端一些调试小技巧

1、本地服务在手机上打开
在调试手机机型的时候,可以在本地起来服务,这时候域名是localhost,打开命令行,输入ipconfig,

选取IPv4,替换掉localhost,在同一网段下,用手机打开即可看到当前运行的页面

2、移动端调取控制台

我们在pc端调试很简单,在控制台就能看到所有的情况,但是有些业务受限于手机机型;指定移动端浏览器才会有的效果这时候怎么看控制台呢?

只需要在head中引入下列代码即可

   <script type="text/javascript" src="https://images.9liuda.com/sdk/static/vconsole.min.js"></script>
   <script>
        var vConsole = new VConsole();
    </script>

利用vconsole,就可以在移动端轻松调取控制台,这是使用CDN引入的;当然vconsole也有npm包,安装在webpack中,有兴趣的可以自己寻找一下

3、数据曝光上报

很多业务中会统计元素的曝光,点击上报等,用以更好的统计用户的习惯,从而推送用户感兴趣的消息
我使用的是vissense
附上链接: https://www.bootcdn.cn/vissense/
很方便的一个插件,可以正确的统计目标元素是否在可视区,以及在可视区范围内的比例,很精确

上面这段代码的就是一个简单的使用方法;在滚动的时候监听某个元素,当目标元素暴露在可视区大于50%的时候,可以进行一些操作