国产亚洲精品资源在线26u

      
      
      <th id="ljgpb"><pre id="ljgpb"><sup id="ljgpb"></sup></pre></th>

      <rp id="ljgpb"></rp>

      您現在的位置: 微信小程序 > 微信小程序開發 > 教程 >

      微信小程序開發--『狗蛋TV』

      來源:微信小程序 編輯:Yiyongtong.com 發布時間:2018-05-18 11:01熱度:

      狗蛋TV是基于微信小程序開發的一款App。gordanLee每天都會推薦一首歌、一篇文章、一段短視頻,每天用十分鐘的細碎時光,點燃內心的光明。目前分為音樂,短視頻,影評三個模塊。

      • 線上開源地址 https://github.com/lishuaixingNewBee/gordanTv 點個贊吧!
      • 小程序開發文檔

      以下所有 API 均由產品公司自身提供,本人皆從網絡獲取。獲取與共享之行為或有侵犯產品權益的嫌疑。若被告知需停止共享與使用,本人會及時刪除此頁面與整個項目。請您暸解相關情況,并遵守產品協議。

      為了方便大家學習和測試,我們提供了https的接口供大家使用,且用且珍惜。請在微信開發設置中加入request合法域名,或者在開發設置中勾選——不校驗合法域名、web-view(業務域名)、TLS 版本以及 HTTPS 證書。

      感謝與支持

      
      -   狗蛋TVapi: https://api.gordantv.top
          -   豆瓣api: https://api.douban.com
          -   QQ音樂api: https://y.qq.com

      項目介紹

      狗蛋TV是基于微信小程序+ES6進行開發,能同時運行在Android、iOS環境下。涵蓋了音樂、短視頻、影評三個版塊。

      • 開屏引導圖
        1. 調用微信wx.onAccelerometerChange重力感應設備API,實現水波蕩漾。
        2. 調用wx.getUserInfo獲取用戶頭像。
      • 工具類
        1. 用Promise封裝wx.request(),簡化代碼結構:
      
      const $get = (url, data) => {
        return new Promise((resolve, reject) => {
          wx.request({
            url,
            data,
            header: { 'Content-Type': 'json' },
            success: resolve,
            fail: reject
          })
        })
      }
      1. 電影評分實現
      
      const convertToStarsArray = (average) => {
        const LENGTH = 5;
        const CLS_ON = 'on'; // 全星
        const CLS_HALF = 'half'; // 半星
        const CLS_OFF = 'off'; // 無星
        let result = [];
        let score = Math.round(average) / 2;
        let hasDecimal = score % 1 !== 0
        let integer = Math.floor(score)
        for (let i = 0; i < integer; i++) {
          result.push(CLS_ON)
        }
        if (hasDecimal) {
          result.push(CLS_HALF)
        }
        while (result.length < LENGTH) {
          result.push(CLS_OFF)
        }
        return result;
      }
      • 小程序內部組件實現上拉刷新,下拉加載
      
      方法一:scroll-view 組件
          方法二:onPullDownRefresh和onReachBottom方法實現小程序下拉加載和上拉刷新
      • 閱讀模塊

        1. 微信小程序使用wxParse解析html
        
        項目中遇到在微信小程序里需要顯示音樂文章的內容,文章內容是通過接口讀取的服
        務器中的富文本內容,是html格式的,小程序默認是不支持html格式的內容顯示的,
        那我們需要顯示html內容的時候,就可以通過wxParse來實現。
      • 
        

        項目安裝

        
            git clone git@github.com:lishuaixingNewBee/gordanTv.git
        

        目錄結構

      •  
      国产亚洲精品资源在线26u

          
          
          <th id="ljgpb"><pre id="ljgpb"><sup id="ljgpb"></sup></pre></th>

          <rp id="ljgpb"></rp>