hogwarts-ui 官方网站

Appearance

Image 图片 ​

基础用法 ​

点击查看示例代码
vue
<template>
  <h-image-v1 :h_data="h_data"></h-image-v1>
</template>

<script setup>
const h_data = {
  content: [
    {
      image: 'https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/pc/%E5%88%87%E7%89%87%402x.png',
      link: 'https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500'
    },
    {
      image: 'https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/h5/%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95%E5%90%8D%E4%BC%81-H5%402x.png',
      link: 'https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500'
    },
  ]
}
</script>
<template>
  <h-image-v1 :h_data="h_data"></h-image-v1>
</template>

<script setup>
const h_data = {
  content: [
    {
      image: 'https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/pc/%E5%88%87%E7%89%87%402x.png',
      link: 'https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500'
    },
    {
      image: 'https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/h5/%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95%E5%90%8D%E4%BC%81-H5%402x.png',
      link: 'https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500'
    },
  ]
}
</script>
点击查看示例代码(yaml)
yaml
content:
  - image: >-
      https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/pc/%E5%88%87%E7%89%87%402x.png
    link: >-
      https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500
  - image: >-
      https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/h5/%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95%E5%90%8D%E4%BC%81-H5%402x.png
    link: >-
      https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500
content:
  - image: >-
      https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/pc/%E5%88%87%E7%89%87%402x.png
    link: >-
      https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500
  - image: >-
      https://lagou-zhaopin-fe.lagou.com/jiaoyu/growth/test_engineer/h5/%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95%E5%90%8D%E4%BC%81-H5%402x.png
    link: >-
      https://edu.lagou.com/crmForm/form/0279ee5641134bdd9c792ccdf89d319f?utm_source=pcapp_edu_course_engineer&lgec_type=website&lgec_sign=D65F20B4C7267487F432755C0D45C500