demo新聞類開發教程：
包含四個頁面:news.js/news.wxss/news.json/news.wxml
<
scroll-view
class
="news_banner"
>
<
view
wx:for="
}"wx:for-index
="idx"
data-idx="
}"class
="news_banner_text
}"data-cid="
}"bindtap
="bannerclick"
>
<
text
>
}text
>
view
>
scroll-view
>
<
view
class
="news"
>
<
view
wx:for="
}"class
="news_list"
data-nid="
}"data-ntitle="
}"data-nimg="
}"data-nsource="
}"bindtap
="newsclick"
>
<
view
class
="news_left"
>
<
image
mode
="scaletofill"
src=
"}">
image
>
<
text
class
="news_date"
>
}text
>
view
>
<
view
class
="news_right"
>
<
text
class
="news_title news_text"
>
}text
>
<
text
class
="news_subtitle news_text"
>
}(} words)
text
>
<
view
class
="news_data"
>
<
text
>
難度:}|
text
>
<
text
>
閱讀:}|
text
>
<
text
>
}|text
>
<
text
>
}text
>
view
>
view
>
view
>
view
>
//引用外部檔案（需要暴露util.js裡面的formatnumber()函式）
var timeutil = require('../../utils/util.js');
var bannerlist = [,,
,,
,]page(,
onload: function
(options))
this.loadnews(0);
},onready:function()
, onshow:function()
, onhide:function()
, onunload:function()
, onpulldownrefresh: function()
); 下拉載入新聞
this.loadnews(0);
},onreachbottom: function()
, bannerclick: function(e
) bannerlist[dataset.idx].show = true;
// 資料是雙向繫結,直接更新對應資料,頁面會載入新資料
// 新聞類目切換
this.setdata()
this.loadnews(1);
},/**
* loadtype 0,初始化/切換新聞類目 1,上拉重新整理 2,下拉載入資料
*/loadnews: function
(loadtype),
method: 'get', // options, get, head, post, put, delete, trace, connect
// header: {}, // 設定請求的 header
success: function
(res
) }
var newlist = that.data.newslist;
//下拉重新整理,新增資料
if(loadtype == 2)
}else
//資料展示
that.setdata()}},
fail: function()
, complete: function()
})},
newsclick: function(e
))},
operatedate: function
(today, date
)else
if(newday < day)else
}elseelse
}}})
view
.news_banner
.news_banner_text
.news_banner_text
text
.select
.news
.news_list
.news_left
.news_left
image
.news_date
.news_right
.news_right
text
/*處理字串過長的展示*/
.news_text
.news_title
.news_subtitle
.news_data
UI介面Demo 微信小程式
精品推薦text class text all 全部精品text view class content class content item wx for wx key src class content item text text view view view view class select...
微信小程式demo解讀（一）
廢話不多說，開始一點一點琢磨小程式。首先從樣式檔案開始。小程式有其特殊的樣式格式為wxss，但是在webstorm上不能識別，並不能為其新增顏色，或者進行typo識別。我們需要設定webstorm可以用css檔案的解析規則對其進行解析。開啟file settings file types可以進行設定...
手機預覽微信小程式demo流程
微信小程式公測了，喜大普奔。終於可以在自己的手機上看到自己的作品了。然而有很多小夥伴還不知道怎樣在自己的手機上預覽之前 的那些demo，這裡天河就為大家帶來手機預覽微信小程式的流程。首先大家需要註冊乙個微信小程式開發號。這裡需要宣告的是，這個開發號不能以前的 訂閱號 服務號 企業號等，也不能用以前用...