鴻蒙OS 添加圖片區(qū)域

實(shí)現(xiàn)圖片區(qū)域通常用 image 組件來(lái)實(shí)現(xiàn)，使用的方法和 text 組件類似。圖片資源放在 common 目錄下，圖片的路徑要與圖片實(shí)際所在的目錄一致。具體示例如下：

<!-- xxx.hml -->
<!-- 插入圖片 -->
<div class="right-container">
  <image class="img" src="{{middleImage}}"></image>
</div>

/* xxx.css */
.right-container {  
  width: 432px;
  justify-content: center;
}
.img {  
  margin-top: 10px;
  object-fit: contain;
  height: 450px;
}

// xxx.js
export default {
  data: {
    middleImage: '/common/ice.png',
  },
}