1.使用场景描述:
页面中的循环体中存在view,且该view非静态内容,需要根据循环体中的变量,现实对应的数据库信息;
2.具体操作:(以视频中案例进行讲解):
1) 主体数据构造及view数据初始化;
说明: 由于view存在于主体数据的循环体中,所以需要在主体的循环体中初始化view数据内容;
a,根据具体的实际情况,明确view页面所用到的所有变量;(案例中为: yhm)
b,在主体数据中构造view用到的变量"yhm";
案例截图说明:
2)主体页面中的view绑定
说明: 将view所需的参数,及view信息的定位参数传递给view
a,对view进行属性绑定;绑定属性"data--url" 案例绑定说明: {"data--url":"/v/v1.html?id="+_id()+"&pathstr=user["+$index()+"]"}
a.1 id 和pathstr 为传参变量,可进行自定义;
a.2 pathstr=user["+$index()+"]"该处中的user为主体页面数据数组的数组名 ;
a.3 在完成绑定后,请切换源码,确保view中无"data--url="/v/test.html"类似代码;
见截图说明: 案例截图说明:
3)view页面对主体页面的传参处理:
a,采用自由标注初始化参数
参考文档: http://www.wware.org/pg/train/ymbz01_a.html
%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%26%23x6CE8%3B%3A%26%23x9875%3B%26%23x9762%3B%26%23x7AEF%3B%26%23x7684%3B%26%23x521D%3B%26%23x59CB%3B%26%23x5316%3B%26%23x7ED1%3B%26%23x5B9A%3B%26%23x4E3A%3B%3A%20%26%23x5C5E%3B%26%23x6027%3B%26%23x7ED1%3B%26%23x5B9A%3B%3A%20%7B%26quot%3Bdata-params%26quot%3B%3A%7B%7B%3Dit._wwd_init%7D%7D%7D
%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%20%26%23xA0%3B%26%23x5907%3B%26%23x6CE8%3B%26%23xFF1A%3B%20%26%23x8FD9%3B%26%23x4E2A%3B%26%23x7ED1%3B%26%23x5B9A%3B%26%23x5B9E%3B%26%23x9645%3B%26%23x4E0A%3B%26%23x5C31%3B%26%23x662F%3B%26%23x540C%3B%26%23x6B65%3B%26%23x89C6%3B%26%23x53E3%3B%26%23x91CC%3B%26%23x9762%3B%26%23x7684%3B%26%23x9ED8%3B%26%23x8BA4%3B%26%23x4F20%3B%26%23x53C2%3B%26%23x7684%3B%26%23x503C%3B%26%23xFF0C%3B%26%23x4E0A%3B%26%23x8FF0%3B%26%23x65B9%3B%26%23x6CD5%3B%26%23x7684%3B%26%23x610F%3B%26%23x4E49%3B%26%23x5C31%3B%26%23x662F%3B%26%23x628A%3B%26%23x591A%3B%26%23x4E2A%3Bkey%26%23x5C01%3B%26%23x88C5%3B%26%23x6210%3B%26%23x4E00%3B%26%23x4E2A%3B%26%23x5BF9%3B%26%23x8C61%3B%26%23x65B9%3B%26%23x4FBF%3B%26%23x4F20%3B%26%23x9012%3B%26%23xFF0C%3B%26%23x4F46%3B%26%23x662F%3B%26%23x4E0A%3B%26%23x8FF0%3B%26%23x65B9%3B%26%23x6CD5%3B%26%23x53EF%3B%26%23x80FD%3B%26%23x4F1A%3B%26%23x4E0D%3B%26%23x597D%3B%26%23x7528%3B%26%23xFF0C%3B%26%23x5982%3B%26%23x679C%3B%26%23x4E0D%3B%26%23x597D%3B%26%23x7528%3B%26%23x7684%3B%26%23x8BDD%3B%26%23x53EF%3B%26%23x4EE5%3B%26%23x76F4%3B%26%23x63A5%3B%26%23x628A%3Bkey%26%23x8FD4%3B%26%23x56DE%3B%26%23xFF0C%3B%26%23x7136%3B%26%23x540E%3B%26%23x4F9D%3B%26%23x6B21%3B%26%23x5728%3B%26%23x89C6%3B%26%23x53E3%3B%26%23x91CC%3B%26%23x9762%3B%26%23x7684%3B%26%23x9ED8%3B%26%23x8BA4%3B%26%23x4F20%3B%26%23x9012%3B%26%23x53C2%3B%26%23x6570%3B%26%23x91CC%3B%26%23x9762%3B
案例截图说明:
4)view视口返回值处理:
a,view视口返回值在返回时,需指点数据位置:pathstr---(该信息有主页面传递而来)
案例截图说明:
案例视频:
案例功能逻辑说明:
显示用户列表,主页面只获取用户id,并将id传递给view,由view去获取用户的姓名;循环view以获取用户列表信息;
视频地址:
拓展延伸-------- 多层view嵌套循环
要点总结:
1,多层view嵌套循环与上述案例中的单层循环的实现原理是相同的;
要点:第二层的数组要绑在第一层的view里面,加个view,然后绑定数组,和第一层一样的格式就可以
2,数据的初始化只需要初始化第一层view数据即可,要把添加的二级数组也初始化到主页面的大数组里面;
要点:添加第二层数组的数据要在第一层的视口里面,根据查询的内容添加第二层的数组的数据,一级view给二级view传值的时候
和主页面给一级view传值的步骤一样,一级view视口返回数据的时候要把这个数组也返回,然后二级view里面的视口返回二级数组里面的信息点。
3,第一层view向第二层view的传参同样要指定定位信息:(示例如下)
{"data--url":"/v/viewtest1.html?id1="+_id()+"&pathstr1="+pathstr()+".gjlb["+$index()+"]"};
范例: www.test.com/v/viewtest1.html? id1=a0c3b4c001cb11e991849bb9dd33c5e1&pathstr1=user[1].gjlb[1]&_ajax=true&_=1545037773229
参数说明:
/v/viewtest1.html-------第二层view的url
pathstr1--------定位信息,其中 pathstr()为当前数据的定位信息;".gjlb["+$index()+"]"-----gjlb为第二层view数据的数组名;
pathstr()截图说明:
该步操作对应上述案例中的4,在第二层view所属的数组初始化时,要将上层view的定位变量添加到本数组里,方便第二层数组获取url中的内层定位。(有点类似于二维数组)