微信小程序foreach
① 微信小程序 數組查找
想嘗試做一個查詢的功能 可以根據查到text 或者根據text查到id
html">resultset:[{id:1,text:"aaa"},{id:2,text:"bbb"},{id:3,text:'ccc'},{id:4,text:'f'}]
附上數組如下,嘗試了一些方法 就像在傳統語言那樣遍歷數組然後尋找相等的值
varresultSet=this.data.resultsetconstlength=resultSet.lengthvarval=this.data.inputValueif(val){
console.log(val)for(leti=0;i<=length;i++){//console.log(resultSet[i])
if(val==resultSet[i].id){
console.lo("找到了")varresult=this.data.resultSet[i].id
console.log("結果是"+result)
}else{
console.log("沒找到結果")
}
}
}else{
console.log("沒輸入啊")
}
}
② 微信小程序怎麼給for循環的view添加樣式
1、把要改變樣式添加到相應js文件的全局變數中。
2、將變數綁定到view中。
3、在view中添加事件。回
4、在相應js文件中添加該自定義答方法changeColor, function,e,this.setData,color , #fff。
③ 微信小程序體驗版 wx:for循環內容不顯示
域名授權,進小程序後台 添加request 域名
④ 微信小程序怎麼在for循環里的index
//wxml
<ul wx:for={{list}} wx:for-item="item" wx:key="*this">
我是第{{index}}個,我叫{{item.name}}
<ul>
//js
Page({
list:[{name:'小明'},{name:'小紅'}]
})
⑤ 微信小程序這種json數據要怎麼在前端循環輸出{"0":{"day":"7","time_data":"數據"}}
講解下循環輸出元素
這里寫圖片描述
這里寫圖片描述
後台存儲的數據給事
{
var local_database = [
{
date: "Sep 18 2016",
post_title:"冬日校花",
post_image: "/images/1.jpg",
text: "美呀,美呀",
view_num: 112,
collect_num: 96,
turn_num: 515,
author_img: "/images/6.jpg",
author:"高晴",
dateTime:"24小時",
detail:"我愛你,愛的如此深沉",
postId:0,
music:{
url: '?down/46993.mp3',
title: "雪の華-南條愛乃",
coverImg: "/music/photo_new/.jpg?max_age=2592000"
},
},
{
date: "Sep 18 2016",
post_title: "冬日校花",
post_image: "/images/2.jpg",
text: "美呀,美呀",
view_num: 112,
collect_num: 96,
turn_num: 515,
author_img: "/images/6.jpg",
author: "高晴",
dateTime: "24小時",
detail: "我愛你,愛的如此深沉",
postId: 1,
music: {
url: '/yq/5092537.mp3',
title: "愛你-陳芳語",
coverImg: "/music/photo_new/.jpg?max_age=2592000"
},
},
{
date: "Sep 18 2016",
post_title: "冬日校花",
post_image: "/images/3.jpg",
text: "美呀,美呀",
view_num: 112,
collect_num: 96,
turn_num: 515,
author_img: "/images/6.jpg",
author: "高晴",
dateTime: "24小時",
detail: "我愛你,愛的如此深沉",
postId: 2,
music: {
url: '/yq/204586755.mp3',
title: "雲煙成雨-房東的貓",
coverImg: "music/photo_new/.jpg?max_age=2592000"
},
},
{
date: "Sep 18 2016",
post_title: "冬日校花",
post_image: "/images/4.jpg",
text: "美呀,美呀",
view_num: 112,
collect_num: 96,
turn_num: 515,
author_img: "/images/6.jpg",
author: "高晴",
dateTime: "24小時",
detail: "我愛你,愛的如此深沉",
postId: 3,
music: {
url: '/yq/213919334.mp3',
title: "Your Song-Lady Gaga",
coverImg: "https://www.ztsje.com/#music/photo_new/.jpg?max_age=2592000"
},
},
]
mole.exports={
postList:local_database,
}
}
前台使用for循環輸出
這里寫圖片描述
這里寫圖片描述:
然後我們自己嘗試構建一個for循環輸出的小程序
app.js以及app.json app.wxss頁面的構造就不放出來了,不會的童鞋可以看博主的第一個小程序文章
初步構造完成如下:
這里寫圖片描述
下面是for.js的構造:
// pages/for/for.js
Page({
/**
* 頁面的初始數據
*/
data: {
data:[
{
name:"張三"
},
{
name:"李四"
},{
name:"王五"
}
],
},
/**
* 生命周期函數--監聽頁面載入
*/
onLoad: function (options) {
},
/**
* 生命周期函數--監聽頁面初次渲染完成
*/
onReady: function () {
},
})
for.wxml
<block wx:for="{{data}}" data-item="item" wx:for-index="idx" >
<view>
第{{idx}}次輸出,姓名:{{item.name}}
</view>
</block>
講解:
這里的for.js中,data是默認存在的函數,負責保存數據,前台的wxml文件只能調用data中的存在的數據
具體的調用方法為雙大括弧加上數據名
for.wxml中
需要循環輸出,需要將for元素放入block中 ,並填入需要循環輸出的數據:這里是data(註:這里的data是js中data中data,大家注意區分下,博主忘了區分)
然後data-item 是給data中的子元素添加一個調用的key名,類似於php的foreach,index則是調用的當前元素在數組中的數字下標,大家可以看到輸出結果是從零開始的
⑥ 怎麼製作微信小程序的遍歷數組的單選功能
1、升抄級你的到最新的653版本。 2、在的第一個頁面頂端,有一個搜索條,在搜索條里輸入:小程序示例然後搜索。點最下面的:搜一搜 小程序示例 朋友圈、公眾號、文章等。 3、選擇第一個結果,圖標是黑色斜寫的英文字母「S」,點開它 4、看如何製作微信小程序的遍歷數組的單選
⑦ 微信小程序for循環的怎麼和後台交換怎麼寫
function getData()
{
return new Promise((resolve, reject)=>{
var arr = [];
var i=0,len = 3;
for(;i<len;i++)
{
//通過 request 向後台發送請求,把數據添加到 arr 數組裡面,當長度相同時執行回調函數
request().then(res=>{
arr.push(res);
if(arr.length === len)resolve(arr);
})
}
});
}
getData().then(res=>{
console.log(res);
}).catch(res=>{
console.log(res);
})
⑧ 微信小程序怎麼給兩列布局循環數據
如果左右的樣式完全一樣,只用一個view來循環即可,如果左右樣式不同,則需要根據Index判斷奇偶來寫左右兩側的樣式。blockwx:if="{{index%2==0}}"
⑨ 微信小程序怎麼把前端for循環的index值讓當前頁的js獲取到
var t = document.getElementById("typeController"); alert(t.options[t.selectedIndex].value);
⑩ 微信小程序怎麼遍歷Java後台獲取到的數組
樓主,這是個json數據吧?可以先用Java自帶的json解析工具JSONObject 解析成數組,然後再從數組中讀數據。