小程序之Button组件，函数的调用与简单的逻辑

我们要实现一个简单的功能，在界面上放置一张图片，设置重新加载按钮，能更新图片。

　　　WXML代码：

<!--index.wxml-->

<view clas="index" style="background: white">

  <image class='imagetest' src="{{imageUrl}}" mode="aspectFill"></image>

  <button bindtap="change">点击刷新</button>

</view>

　　　JS代码：

//index.js

const app = getApp()

Page({

  data: {

    imageUrl: "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1548078773863&di=926baa6630a9b7c434a949636bb8d0c0&imgtype=0&src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01f5585b35aa86a80120b959631921.jpg%403000w_1l_2o_100sh.jpg",

  },

  change: function (event) {

    var that = this;

    this.setData({

      imageUrl:     "https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1988014297,2570740281&fm=26&gp=0.jpg"

    })

  }

})

　　　效果图：

　　　   点击刷新后   变成

待补：多次点击“ 点击刷新 ”，能跳转出多张图片。