vue 移动端验证不同设备工具类封装和使用

最新推荐文章于 2024-06-12 17:07:40 发布

原创

最新推荐文章于 2024-06-12 17:07:40 发布 · 1.6k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue #vue移动端不同设备 #微信安卓 ios

本文介绍了在Vue移动端项目中如何封装和使用一个工具类来判断不同设备，如iOS、安卓和微信环境，并提供了详细的步骤和代码示例。通过创建自定义JS文件，引入并调用封装的方法，实现与原生交互的功能。文中还讲解了回调函数的使用，以便接收原生传递的参数。最后，作者分享了一个实际操作的小案例，帮助读者更好地理解和应用。

今儿项目版本更新上线了，抽点空记录下最近遇到的一些技术功能。首先我们开发移动端，经常会有需求是某些模块功能在 ios端安卓以及微信端下各展示不同，那么这就需要用到封装一个方法来调用了。下面的代码大可在文件中创建个工具类的文件夹，拷贝放进去使用。废话不多说，直接上代码：
第一步：首先在项目中创建个文件夹，里面创建个自定义js文件，将这块代码拷贝进去

//验证工具封装  ----- 如果需要直接拿去用
export let method = {
        /**
   * 是否是安卓设备
   * @returns {boolean}
   */
        verifyAndroid: function() {
                var u = navigator.userAgent;
                var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
                if (isAndroid) {
                        return true;
                } else {
                        return false;
                }
        },
        /**
   *是否是ios设备
   * @returns {boolean}
   */
        verifyIos: function() {
                var u = navigator.userAgent;
            &