小程序学习心得之数据绑定技巧

1 在template中可以通过对象的赋值形式来对template中的data传值

<template is="starsTemplate" data="{{stars:stars, score: average}}" />

2 …的运用

<block wx:for="{{movies}}" wx:for-item="movie">     
   <template is="movieTemplate" data="{{...movie}}"/>
</block>

…movie代表具体哪一个对象
3 不同数据的相同引用

var readyData = {};
    readyData[settedKey] = {
      categoryTitle: categoryTitle,
      movies: movies  
    }
this.setData(readyData);
<template is="movieListTemplate" data="{{...top250}}"/>
<template is="movieListTemplate" data="{{...comingSoon}}" />

4 数据传递的四种方式
一:url传递
通过在view设置data,在函数中调用event.currentTarget.dataset.category获取要传递的参数附加到url中
在onLoad中通过options.category获取

 <view catchtap="onMoreTap" class="more" data-category="{{categoryTitle}}">
onMoreTap: function (event) {
    var category = event.currentTarget.dataset.category;
    wx.navigateTo({
      url: "more-movie/more-movie?category=" + category
    })
 }
onLoad: function (options) {
    var category = options.category;
}

二:全局变量

三:发送事件接受事件,适合传递对象
四:缓存
wx.getStorageSync取缓存wx.setStorageSync设置缓存this.setData传入数据

 wx.getStorageSync('posts_collected')
 wx.setStorageSync('posts_collected', postsCollected);
 this.setData({
       collected: postCollected
 })

猜你喜欢

转载自blog.csdn.net/qq_22182279/article/details/78453529