全部干货vue中封装的常用方法(持续更新)

Posted 尔嵘

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了全部干货vue中封装的常用方法(持续更新)相关的知识,希望对你有一定的参考价值。

1.获取时间(一般时间选择器默认时间用到)

//获取当前时间,day为number,getDay(-1):昨天的日期;getDay(0):今天的日期;getDay(1):明天的日期;
getDay(day) 
      let today = new Date(),
        targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;
      today.setTime(targetday_milliseconds);
      let tYear = today.getFullYear(),
        tMonth = today.getMonth(),
        tDate = today.getDate(),
        tHour = today.getHours(),
        tMinute = today.getMinutes(),
        tSeconds = today.getSeconds();
      tMonth = this.doHandleMonth(tMonth + 1);
      tDate = this.doHandleMonth(tDate);
      tHour = this.doHandleMonth(tHour);
      tMinute = this.doHandleMonth(tMinute);
      tSeconds = this.doHandleMonth(tSeconds);
      return tYear + '-' + tMonth + '-' + tDate + ' ' + tHour + ':' + tMinute + ':' + tSeconds;
 ,

2.判断数据是否是json

//判断数据源是不是json数据
    isJsonString(str) 
      try 
        if (typeof JSON.parse(str) == 'object') 
          return true;
        
       catch (e) 
        console.log('e', e);
      
      return false;
    ,

3.获取指定位置的天气信息:

//获取天气信息
    getWeather() 
      axios
        .get('https://geoapi.qweather.com/v2/city/lookup', 
          params: 
            location: '杭州市',
            key: '',
            _t: new Date().getTime()
          ,
        )
        .then(( data: res ) => 
          // console.log(res);
          if (res.code != 200) 
            return this.$message.error('获取地理位置定位ID(locationID)失败');
          
          if (res.location.length > 0) 
            axios
              .get('https://devapi.qweather.com/v7/weather/now', 
                params: 
                  location: res.location[0].id,
                  key: '',
                  _t: new Date().getTime()
                ,
              )
              .then(( data: res1 ) => 
                // console.log('res1', res1);
                if (res1.status != 0) 
                  return this.$message.error('获取天气信息失败');
                
                this.$set(this.weatherInfo, 'wea', res1.now.text);
                this.$set(this.weatherInfo, 'tem', res1.now.temp);
                this.$set(this.weatherInfo, 'wea_img', res1.fxLink);
              )
              .catch((error) => 
                console.log(error);
                return false;
              );
           else 
            return this.$message.error('无法获取地理位置定位ID(locationID)');
          
        )
        .catch((e) => 
          console.log(e);
          return false;
        );
    ,

4.判断浏览器类型

/**
 * 判断浏览器的类型
 */
export function browserType() 
    var userAgent = navigator.userAgent.toLowerCase();
    var testCenter = 
        ie: function isIE()  //ie?
            if (!!window.ActiveXObject || "ActiveXObject" in window)
                return true;
            else
                return false;
        ,
        edge: () => 
            return /dge/.test(userAgent)
        ,
        chrome: () => 
            return /chrome/.test(userAgent)
        ,
        safari: () => 
            return /safari/.test(userAgent) && !(/chrome/.test(userAgent))
        ,
        opera: () => 
            return /opera/.test(userAgent)
        ,
        msie: () => 
            return /msie/.test(userAgent) && !/opera/.test(userAgent)
        ,
        mozilla: () => 
            return /mozilla/.test(userAgent) && !/(compatible|webkit)/.test(userAgent)
        
    ;
    var browserObj = ;
    for (var k in testCenter) 
        var result = testCenter[k]();
        var version = (userAgent.match(/.+(?:rv|it|ra|ie)[\\/: ]([\\d.]+)/) || [])[1];
        if (result) 
            browserObj.browser = k;
            browserObj.version = version;
            return browserObj;
        
    

5.判断object类型

//判断Object数据类型
export function isType(obj) 
    var type = Object.prototype.toString.call(obj);
    if (type == '[object Array]') 
        return 'Array';
     else if (type == '[object Object]') 
        return "Object"
     else 
        return 'param is no object type';
    

6.全局时间格式封装

export function getSystemDate(param, dateVal) 
    let systemDate = dateVal ? new Date(dateVal) : new Date(),
        year = systemDate.getFullYear(),
        month = systemDate.getMonth() + 1,
        date = systemDate.getDate(),
        hours = systemDate.getHours(),
        minutes = systemDate.getMinutes(),
        seconds = systemDate.getDate(),
        milliseconds = systemDate.getMilliseconds();
    month = month < 10 ? '0' + month : month;
    date = date < 10 ? '0' + date : date;
    hours = hours < 10 ? '0' + hours : hours;
    minutes = minutes < 10 ? '0' + minutes : minutes;
    seconds = seconds < 10 ? '0' + seconds : seconds;
    if (param == 0) 
        return year + '-' + month + '-' + date;
     else if (param == 1) 
        return year + '-' + month + '-' + date + " " + hours + ":" + minutes + ":" + seconds;
     else if (param == 2) 
        return year + '-' + month + '-' + date + " " + hours + ":" + minutes + ":" + seconds + '.' + milliseconds;
     else if (param == 3) 
        return year + '-' + month;
     else if (param == 4) 
        return year
    

以上是关于全部干货vue中封装的常用方法(持续更新)的主要内容,如果未能解决你的问题,请参考以下文章

vue中封装的常用方法(全部干货)

vue项目常用方法封装,持续更新中。。。

常用js封装方法,持续更新

beego redigo redis连接池封装了一下常用的方法 持续学习 持续更新

Vue 之 工作中常用的公共方法封装整理(不定时更新)

前端Util.js-ES6实现的常用100多个javaScript简短函数封装合集(持续更新中)