uni-app頁面中使用本地背景圖片

上代碼就完了

<template>
   <view :style="{backgroundImage:`url(${indexBackgroundImage})`,backgroundSize: 'cover'}" >
</view>
</template>

<script>
/**
* author 漫路
* 解釋:css背景圖片不能使用本地圖片,官方給的理由是小程序不支持本地圖片,只支持網絡訪問或者base64。
	因此uniapp也不支持,可是隻要不超過40kb便可。
* 注意: 把下面導入的圖片路徑改爲你本身的。
* 還有:若是圖片大小超過40kb是不會自動轉換的,須要程序員本身吧圖片轉換成base64格式
*/
import indexBackgroundImage from "@/static/images/myInfo/di.png"
export default {
   data() {
     return {
	indexBackgroundImage:indexBackgroundImage
     };
   },
}
</script>
相關文章
相關標籤/搜索