最近用vue和Cordova组合写android应用,调式是经常用console.log打写log,

今天试试封装一下,便于调试

效果这样

代码如下

mian.js

import globalUtils from './utils/globalUtils'
Vue.use(globalUtils)

globalUtils.js

export default {
  install (Vue, option) {
    Vue.prototype.appAndroidApi = function (sucessCallback, functionName, args) {
      / 
      try{
        cordova.exec(sucessCallback, function (message) {
        }, 'CordovaInterface', functionName, args)
      } catch (e) {
        // console.warn(e)
      }
    }
    
    function Console() {
      let myconsole = new Object();
      myconsole.log = function (title, obj, color, bgcolor) {
        if (!color) {
          color = '#1f222d'
        }
        if (!bgcolor) {
          bgcolor = '#cccccc'
        }
        console.log('%c ------robot--log--title-----------------:' + title + ' ', 'background: ' + bgcolor + '; color: ' + color + ';padding:8px 12px;')
        if (obj) {
          console.log('%c ------robot--log--obj-------------------:', 'background: ' + bgcolor + '; color: ' + color + ';padding:8px 12px;', obj)
        }
      }
      myconsole.debug = function (title, obj, color, bgcolor) {
        if (process.env.NODE_ENV === 'development') {
          if (!color) {
            color = '#d2ff1d'
          }
          if (!bgcolor) {
            bgcolor = '#222'
          }
          console.log('%c ------robot--debug--title-----------------:' + title + ' ', 'background: ' + bgcolor + '; color: ' + color + ';padding:8px 12px;')
          if (obj) {
            console.log('%c ------robot--debug--obj-------------------:', 'background: ' + bgcolor + '; color: ' + color + ';padding:8px 12px;', obj)
          }
        }
      }
      myconsole.error = function (title, obj, color, bgcolor) {
        if (!color) {
          color = '#f3253c'
        }
        if (!bgcolor) {
          bgcolor = '#222'
        }
        console.log('%c ------robot--error--title-----------------:' + title + ' ', 'background: ' + bgcolor + '; color: ' + color + ';padding:8px 12px;')
        if (obj) {
          console.log('%c ------robot--error--obj-------------------:', 'background: ' + bgcolor + '; color: ' + color + ';padding:8px 12px;', obj)
        }
      }
      return myconsole;
    }
    // 全局log函数
    Vue.prototype.$console = new Console()
  }
}

 

Logo

前往低代码交流专区

更多推荐