Skip to main content

自定义组件

示例：如何上报日志

为方便开发人员排查线上问题，平台提供了CCLog，可以通过此功能，上报异常信息到监控平台

1.组件中上报Info日志

<template>
  <div>
    <el-button @click="reportInfo">上报Info日志</el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      componentInfo: {
        // 组件唯一标识，全局唯一
        component: "cloudcc-demo-a",
        // 组件名称，在页面编辑器显示的名字
        compName: "cloudcc-demo-a",
        // 组件描述信息
        compDesc: "组件描述信息",
        // 设置组件在应用启动的时候加载
        loadModel: "start",
      },
      isLock: false,
    };
  },
  methods: {
    reportInfo() {
      let logInfo = {
        infoType: "debug",
        serviceName: "my app",
        infoMessage: "描述信息",
      };
      window.$CCDK.CCLog.reportInfoLog(logInfo);
    },
  },
};
</script>

2.组件中上报Error日志

<template>
  <div>
    <el-button @click="reportError">上报Error日志</el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      componentInfo: {
        // 组件唯一标识，全局唯一
        component: "cloudcc-demo-a",
        // 组件名称，在页面编辑器显示的名字
        compName: "cloudcc-demo-a",
        // 组件描述信息
        compDesc: "组件描述信息",
        // 设置组件在应用启动的时候加载
        loadModel: "start",
      },
      isLock: false,
    };
  },
  methods: {
    reportError() {
      let logInfo = {
        serviceName: "my app",
        errorMessage: "描述信息",
        printStackTraceInfo: "printStackTraceInfo描述信息",
      };
      window.$CCDK.CCLog.reportErrorLog(logInfo);
    },
  },
};
</script>

3.查看上报的日志

  • 登录cloudcc系统——》点击右上角人头像——》点击开发者平台
  • 进入对应的日志菜单即可查看