Skip to main content

自定义组件

示例:如何引入图片

某些场景下,组件中可能需要引入静态展示的图片,那么可以使用静态资源实现

1.上传图片至静态资源

  • 进入开发者控制台--》静态资源菜单--》点击新建--》保存后在列表中可查看
  • 点击列表中地址列的复制按钮,复制静态资源链接成功

2.在组件中使用静态资源图片

<template>
  <div>
    <img
      style="width: height: 800px"
      src="https://res.lightning.cloudcc.cn/staticResource/org08f84e9c0566eaf0c/202309/16945042351857583.png"
    />
  </div>
</template>

<script>
export default {
  data() {
    return {
      componentInfo: {
        // 组件唯一标识,全局唯一
        component: "cloudcc-demo-a",
        // 组件名称,在页面编辑器显示的名字
        compName: "cloudcc-demo-a",
        // 组件描述信息
        compDesc: "组件描述信息",
        // 设置组件在应用启动的时候加载
        loadModel: "start",
      },
      isLock: false,
    };
  },
};
</script>