商城系統(tǒng) 注冊(cè)

小程序?qū)崿F(xiàn)圖片預(yù)加載的方式

2020-09-27|HiShop
導(dǎo)讀:網(wǎng)頁(yè)有頁(yè)面預(yù)加載,小程序也有圖片預(yù)加載,小程序圖片加載的速度決定了用戶的停留時(shí)間,那么小程序圖片預(yù)加載如何實(shí)現(xiàn)?...

  小程序?qū)崿F(xiàn)圖片預(yù)加載的方式

  網(wǎng)頁(yè)有頁(yè)面預(yù)加載,小程序也有圖片預(yù)加載,小程序圖片加載的速度決定了用戶的停留時(shí)間,那么小程序圖片預(yù)加載如何實(shí)現(xiàn)?

  在微信小程序中,要顯示一張圖片,有兩種圖片加載方式:

  一、加載本地圖片

小程序?qū)崿F(xiàn)圖片預(yù)加載的方式

  src=”/image/arrowright.png” 這句就是加載本地圖片資源的。

  二、加載網(wǎng)絡(luò)圖片

小程序?qū)崿F(xiàn)圖片預(yù)加載的方式

  微信在加載網(wǎng)絡(luò)這方面封裝的還是很好的,包括語(yǔ)音和視頻的加載。直接給’src’這個(gè)屬性附上地址,它會(huì)自動(dòng)加載。

  這個(gè)imageUrl是在js文件中數(shù)據(jù)

  data:{

  imageUrl:”http://img1.3lian.com/2015/w7/85/d/101.jpg”

  },

  也可以直接寫(xiě)成

  小程序?qū)崿F(xiàn)圖片預(yù)加載的方式

  在按鍵的響應(yīng)方法更換加載圖片

  downImage:function(event){

  console.log(event)

  var that = this;

  this.setData({ imageUrl:”另一個(gè)url”

  })

  }
 

HiShop小程序工具提供多類(lèi)型商城/門(mén)店小程序制作,可視化編輯 1秒生成5步上線。通過(guò)拖拽、拼接模塊布局小程序商城頁(yè)面,所看即所得,只需要美工就能做出精美商城。

更多小程序開(kāi)發(fā)案例,盡在:http://m.descansotropical.com/xiaocx/kaifa.html
 

小程序顯示圖片相關(guān)文章:

小程序加載圖片如何實(shí)現(xiàn)

小程序開(kāi)發(fā)上傳圖片如何實(shí)現(xiàn)

小程序上傳圖片組件及上傳多張圖片

電話咨詢 預(yù)約演示 0元開(kāi)店