微信小程式之資料繫結的妙用!

2022-06-11 22:24:15 字數 2492 閱讀 3408

<

view

>

<

swiper

indicator-dots

='true'

autoplay

='ture'

interval

='5000'

>

<

swiper-item

>

<

image

src="/images/swiper3.jpeg"

>

image

>

swiper-item

>

<

swiper-item

>

<

image

src="/images/swiper2.jpeg"

>

image

>

swiper-item

>

<

swiper-item

>

<

image

src="/images/swiper1.jpeg"

>

image

>

swiper-item

>

swiper

>

<

block

wx:for

="}"

wx:for-item

="item"

>

<

view

class

="post-container"

>

<

view

class

="post-author-date"

>

-常見的一列四行布局--

>

<

image

class

="post-author"

src="}"

>

image

>

<

text

class

="post-date"

>}

text

>

view

>

<

view

>

<

text

class

="post-title"

>}

text

>

<

image

class

="post-image"

src="}"

>

image

>

<

text

class

="post-content"

>}

text

>

view

>

<

view

class

="post-like"

>

<

image

class

="post-like-image"

src="../../images/icon/star.png"

>

image

>

<

text

class

="post-like-font"

>}

text

>

<

image

class

="post-like-image"

src="../../images/icon/view.png"

>

image

>

<

text

class

="post-like-font"

>}

text

>

view

>

view

>

block

>

view

>

var postsdata = require('../../data/posts-data.js')

page(,

/** 生命週期函式--監聽頁面載入

*/onload:

function

(options) }"再改成postlist

//下面這種方法要把wxml中改成wx:for="}"

//用陣列的形式來繫結多個新聞塊的內容,利用for迴圈來反覆呼叫後台資料

this

.setdata();

}})

var local_database=[,,

,,

,] module.exports =

本篇部落格尚未寫完,會在後期進行完善。

學生黨的第一篇部落格@_@,加油!

微信小程式之資料繫結

紅色盒子 淺藍盒子 綠色盒子 這個綠色盒子裡又可以切分成兩個盒子 白色字型較大乙個盒子,白色字型較小乙個盒子 藍色盒子 資料先靜態,後動態 簡單的說就是剛開始,你可以直接先往頁面裡塞靜態資料,然後除錯樣式,樣式搞定了,就可以把靜態資料換成動態資料了。換動態資料呢,又可以分為兩步,大神都是一步到位的,...

微信小程式 WXML語法之資料繫結

wxml 中的動態資料均來自對應 page 的 data。資料繫結使用 mustache 語法 雙大括號 將變數包起來,可以作用於 mustache 語法 簡介 內容 page 元件屬性 需要在雙引號之內 page 控制屬性 需要在雙引號之內 page 關鍵字 需要在雙引號之內 true boole...

微信小程式 雙向資料繫結

舉個例子class weui cell weui cell input class weui cell hd class weui label space ensp 接 待 人text view view class weui cell bd class weui input name manage...