还未发育成熟就被强j视频,欧美α片无限看,免费无码又爽又刺激高潮视频

无码人妻精品一区二区蜜桃百度,日本猛少妇色xxxxx猛交,免费无码黄真人影片在线,亚洲a成人午夜天堂

12月

這個(gè)冬天，讓騰訊視頻帶給你溫暖

1454

金秋之后，便是寒冬。2017年就要過(guò)去了，這一年承載了太多的記憶，一個(gè)騰訊視頻demo，幫助我們記錄下來(lái)這些或難過(guò)，或美好，或感動(dòng)的瞬間。

一個(gè)仿騰訊視頻的小程序：

開(kāi)發(fā)工具：

微信開(kāi)發(fā)者工具
小程序開(kāi)發(fā)文檔
iconfont矢量圖標(biāo)庫(kù)：可以找到合適的tabBar圖標(biāo)
eas-mock：提供虛擬數(shù)據(jù)接口
wilddog：實(shí)現(xiàn)毫秒級(jí)的實(shí)時(shí)數(shù)據(jù)同步功能，無(wú)需自己構(gòu)建后端服務(wù)器

項(xiàng)目功能：

1.已經(jīng)實(shí)現(xiàn)功能：

首頁(yè)界面的還原
加載，刷新，跳轉(zhuǎn)等基礎(chǔ)事件
swiper， scroll等滑動(dòng)事件
利用easy-mock實(shí)現(xiàn)從后臺(tái)獲取數(shù)據(jù)等
利用wilddog實(shí)現(xiàn)搜索歷史記錄，微信登錄功能等

2.仍在努力的功能：

精準(zhǔn)搜索匹配
評(píng)論，回復(fù)等功能
觀看歷史功能

頁(yè)面注冊(cè)：

"pages/index/index", //主頁(yè)
"pages/videos/videos", //短視頻
"pages/mine/mine", //我的
"pages/search/search", //首頁(yè)和頻道頁(yè)面鏈接的搜索界面
"pages/channel/channel", //頻道
"pages/playing/playing", //播放界面

項(xiàng)目展示：

1.首頁(yè)的展示：

首頁(yè)其實(shí)是比較好看的，美觀大方，很可惜官方已經(jīng)改版了

每一個(gè)swiper的背景和先進(jìn)張圖片是綁定的

index.wxml部分代碼

<image class="top-image" src="{{bannerList[activeBannerIndex].url}}" mode="widthFix"></image>

index.js部分代碼

bannerList  : [
  {
    url :　"../../images/hu_1.png"
  },{
    url :  "../../images/huang_1.jpg"
  },{
    url :  "../../images/zhao_1.jpg"
  }
  ],

2.短視頻，頻道界面的展示：

這里的數(shù)據(jù)是從easy-mock獲得的

這是我的接口,沒(méi)有做很多，大家可以用來(lái)練練手，后續(xù)會(huì)增加的

<swiper-item>
              <view class="swiper-item weui-tab__content" wx:for="{{wangzhe}}">
                  <view class="contain">
                      <view class="list-title">{{item.label}} ></view>
                      <view class="detail" wx:for="{{item.video}}">
                          <image src="{{item.videoImage}}" mode="widthFix" class="wz"></image>
                          <view class="list-font"><text>{{item.title}}</text></view>
                      </view>
                  </view>
              </view>
  </swiper-item>

因?yàn)閿?shù)據(jù)都是圖片，所以為了還原真實(shí)性，我用偽元素做了個(gè)三角形播放圖標(biāo)

.picture ::before
  {
  position: absolute;
  border:11px solid transparent;
  border-left:17px solid #fff;
  content: "";
  top: 100px;
  left: 180px;
  }

3.播放界面的展示：

4.搜索界面的展示：

搜索界面引用了weui樣式

@import "./weui.wxss";

<view class="weui-search-bar">  
      <view class="weui-search-bar__form">  
          <view class="weui-search-bar__box">  
              <icon class="weui-icon-search_in-box" type="search" size="14"></icon>  
              <input type="text" class="weui-search-bar__input" placeholder="請(qǐng)輸入片名主演或?qū)а?quot; value="{{inputVal}}" focus="{{inputShowed}}" bindinput="bindKeyInput"/>  
              <view class="weui-icon-clear"  bindtap="clearInput">  
                  <icon type="clear" size="14"></icon>  
              </view>  
          </view>  
          <label class="weui-search-bar__label" hidden="{{inputShowed}}" bindtap="showInput">  
              <icon class="weui-icon-search" type="search" size="14"></icon>  
              <view class="weui-search-bar__text" bindtap="">搜索</view>  
          </label>  
      </view>  
      <view class="weui-search-bar__cancel-btn" hidden="{{!inputShowed}}" bindtap="addItem">搜索</view>  
  </view>  
  <view>  
      <view  class="search-log" wx:for="{{searchs}}">  
          <text style="font-size:14px;font-family:microsoft yahei">{{item.text}}</text>
          <icon type="clear"  class="inline" bindtap="deleteItem" data-key="{{item.key}}" size="14"></icon>
      </view>      
  </view>

隱藏了搜索記錄和搜索框 data:{

searchs:[], current:null, hidden:true, // 加載提示框是否顯示

scrollTop : 0, // 居頂部高度

inputShowed: false, // 搜索輸入框是否顯示

inputVal: "", // 搜索的內(nèi)容

histroyShowed:true //搜索記錄 }

關(guān)于wilddog

利用野狗sdk，我們可以實(shí)現(xiàn)多種實(shí)時(shí)功能，能夠在各個(gè)終端修改后臺(tái)數(shù)據(jù)，消息傳遞毫秒可達(dá)，能夠?yàn)樾〕绦蜷_(kāi)發(fā)者們上線提供一個(gè)良好的幫助

這是他的官方文檔

首先要導(dǎo)入wilddog-weapp-all.js var wilddog = require('wilddog-weapp-all');
引用創(chuàng)建的接口 var config = { syncURL:'http://appid.wilddogio.com', authDomain:'appid.wilddog.com' } appid為你創(chuàng)建的應(yīng)用id
wilddog是以key-value的形式存儲(chǔ)數(shù)據(jù)，創(chuàng)建引用會(huì)定位到根節(jié)點(diǎn)。若要定位到子節(jié)點(diǎn)，只需在url后追加路徑即可:

利用野狗的child()方法獲取子節(jié)點(diǎn)，達(dá)到刪除和增加的功能

addItem:function(){
      if(this.data.current != null){
        // 將所有的后臺(tái)業(yè)務(wù)交給app.js
        app.addItem(this.data.current)
      }
      this.setData({
        inputVal:""
      })
    },
    deleteItem:function(e){
      var key = e.target.dataset.key;
      this.ref.child(key).remove();
    },
  
    onLoad:function(options){  
      this.ref = app.getTodoRef();
      this.ref.on('child_added',function(snapshot,prkey){
        var key = snapshot.key()
        var text = snapshot.val()
        // JSON結(jié)構(gòu)
        var newItem = {key:key, text:text}
        this.data.searchs.push(newItem);
        this.setData({
          searchs:this.data.searchs
        })
      },this);
      this.ref.on('child_removed',function(snapshot){
        var key = snapshot.key();
        var index = this.data.searchs.findIndex(
          (item,index)=>{
            if(item.key == key){
              return true;
            }
            return false;
          });
          if(index >= 0){
            this.data.searchs.splice(index,1);
            this.setData({
              searchs:this.data.searchs
            })
          }
      },this)
    }

一點(diǎn)心得：

1.遇到的問(wèn)題：

寫(xiě)完數(shù)據(jù)后發(fā)現(xiàn)才發(fā)現(xiàn)內(nèi)容全都不見(jiàn)了：

小程序只支持http:// 服務(wù)請(qǐng)求
用手機(jī)測(cè)驗(yàn)的時(shí)候奇卡無(wú)比：

在樣式swiper中加入這條代碼就解決了 -webkit-overflow-scrolling : touch;
在手機(jī)測(cè)驗(yàn)時(shí)，整個(gè)頁(yè)面會(huì)隨著滑動(dòng)：

在樣式中加入超出則隱藏 overflow:hidden;
如果js部分出現(xiàn)問(wèn)題了，那么就應(yīng)該console一下關(guān)鍵數(shù)據(jù)，看看是否能夠打印出來(lái)，然后慢慢排除