小程序 動態添加數據並顯示


1.通過后台接口獲取數據遍歷展示
<view class='comment_content' wx:for='{{comment}}' wx:for-item='item'>
<view class='comment_user'>
<image src='{{item.user_photo}}'></image>
<view>{{item.user_nick}}</view>
</view>
<view class='comment_info'>{{item.content}}</view>
<view class='get_comment'>
<view class='get_comment_info' catchtap='changeimg' data-index='{{index}}'>
<image src='./zan2@2x.png' class='zan' wx:if="{{item.like_status==1}}"></image>
<image src='./zan@2x.png' class='zan' wx:else></image>
<view>{{item.like_count}}</view>
</view>
</view>
</view>
2.發表評論
<view class='to_talk' wx:if='{{talk}}'>
<view class='take_star' wx:if="{{second_p}}">
<view>星級評價:</view>
<star key='{{num}}' is_click='{{is_click}}' bindincrement='incrementTotal'></star>
</view>
<view class='take_feel'>
<textarea class='input_feel' bindinput="bindTextAreaBlur" placeholder="請分享一下你的感受" value='{{feel}}'></textarea>
<button class='isok' catchtap='talk_feel'>確認</button>
</view>
</view>
3,將評論通過接口傳向數據庫,並在頁面展示
在回調函數success中,定義一個對象添加進comment進行展示
console.log('添加成功');
let id = res.data.data;
let newComment = {
content: that.data.feel,
id: id,
like_count: 0,
like_status: 0,
sec_comm_count: '',
user_nick: userInfo.user_nick,
user_photo: userInfo.user_photo,
second: [],
};
console.log(newComment)
 //在這里要注意arr1的初始值是‘that.data.comment’,不能為空
let arr1 = that.data.comment;
arr1.unshift(newComment);
that.setData({
comment: arr1
})


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM