apiCloud實現載入更多效果,基本完美

2021-09-22 10:39:53 字數 3456 閱讀 9160

$page = $this->_request(

'page'

,'trim'

,'1'

);$pagesize = 10

;// 預設獲取10條

select * from sh_category limit

20;select * from sh_category limit

0,10; // 第一頁

select * from sh_category limit

10,10;// 第二頁

程式處理

$goods = $this->where(

$where

)->limit((

$page

-1)*$num

,$num

)->order(

$order

)->select();

第一頁,就是從0,10。第二頁,就是10,10。

$this->outdata[

'status'

] = '1'

;$this->outdata[

'msg'

] = '獲取成功'

;$this->outdata[

'info'

]['goods'

] = $goods

;$this->outdata[

'info'

]['page'

] = $page

;$this->outdata[

'info'

]['category_id'

] = $category_id;if

(count

($next_page_goods

) > 0

) else

"info_area"

><

/div>

id="info_tmpl"

type="text/x

-dot

-template

">

}

<

divid

="goods_data"

class

="aui-content"

>

<

ulclass

="aui-list aui-media-list"

>

}<

liclass

="aui-list-item"

onclick

="opengoodsdetail('}','}')"

>

<

divclass

="aui-media-list-item-inner"

>

<

divclass

="aui-list-item-media"

>

<

imgsrc

="}"

>

<

/div>

class="aui-list-item-inner">

class="aui-list-item-text">

class="aui-list-item-title">

}div

>

<

/div>

class="red">¥}div

>

<

divclass

="aui-list-item-text"

>

<

divclass

="aui-list-item-title"

style

="text-decoration:line-through;"

>

¥}<

/div>

class="aui-list-item-right">已售}件div

>

<

/div>

div>

<

/div>

li>

}<

/ul>

div>

}

<

divid

="more"

onclick

="ajaxgetmore('}','}')"

style

="margin: 15px;color:gray;text-align: center;"

>

載入更多

<

/div>

}id="none"

style="margin: 15px;color:gray;text-align: center;">沒有了div

>}}

<

divstyle

="margin-top:20px;text-align: center;color:gray;"

>

暫無資料

<

/div>

}script

>

這裡有個ajaxgetmore方法。處理載入更多資料。

id="base_area"

class=

"aui-content"

>

div>

1)預設的ajax獲取第一頁資料js

// 獲取分類商品資訊

api.ajax(}},

function

(json

,err)

else

);}});

2)ajaxgetmore獲取更多js

// 獲取更多

function

ajaxgetmore

(category_id

,page) }},

function

(json

,err)

else

);}});}

核心就在這裡

var

base_area =

$api.byid('base_area'

);var

goods_data=

$api.byid('goods_data'

);$api.html(goods_data));

html,描述:獲取或設定dom元素的innerhtml。

基本完美~

apiCloud實現載入更多效果,基本完美

page this request page trim 1 pagesize 10 預設獲取10條 select from sh category limit 20 select from sh category limit 0,10 第一頁 select from sh category limi...

apiCloud實現載入更多效果,基本完美

page this request page trim 1 pagesize 10 預設獲取10條 select from sh category limit 20 select from sh category limit 0,10 第一頁 select from sh category limi...

Vant 實現 上拉載入更多

v model loading finished finished immediate check false finished text 沒有更多了 load onload offset 10 itemlist換成你自己的資料 for item in itemlist key item.id va...