午夜91福利视频,午夜成人在线观看,午夜在线视频免费观看,午夜福利短视频,精品午夜成人免费视频APP

小程序模板網

微信小程序數據綁定以及跳轉傳參

發布時間:2021-06-01 08:41 所屬欄目:小程序開發教程
首先,我們先創建一個新的項目。可以看到創建的新的小程序有一個默認的HelloWorld的Demo.如下圖
這里先介紹一下微信小程序的數據綁定

微信小程序的基于MINA框架開發的。每一個頁面由 .js(必須) .wxml(必須) .wxss(非必需) .json(非必須) 這四個文件組成,且命名必須相同。
我們打開pages文件(jian)夾下面的index.js.修改

Page({
  data: {
    motto: '第一頁的Hello World',//這里做了修改
    userInfo: {}
  }

將motto對應的(de)值做(zuo)了(le)一下簡單的(de)修(xiu)改,編譯,可以看到主頁的(de)HellowWorld也已經做(zuo)了(le)相(xiang)應的(de)變化(hua)。在看看 .wxml文(wen)件

 <text class="user-motto">{{motto}}</text>

可以看到有(you)這么一(yi)段代碼,而中(zhong)間的{{motto}} 也剛好對應(ying)了.js里面的motto。沒錯,這就是微信小程序的數(shu)據(ju)綁(bang)定(ding)。 通過{{ 對應(ying).js中(zhong)的對應(ying)的data}}來(lai)進(jin)行綁(bang)定(ding)。

接下來,我(wo)(wo)們(men)要將這個(ge)我(wo)(wo)們(men)修改過的motto設置成點擊事件,跳轉到另一個(ge)頁面并且(qie)將參數傳遞過去。

先添加點擊事件 gotologs
 <view class="usermotto">
    <text class="user-motto" bindtap="gotologs">{{motto}}</text>
  </view>
在.js里面添加方法。
gotologs() {
   wx.navigateTo({
     url: '../logs/logs?motto='+this.data.motto
   })
 }

由于使用的是ES6語法,你需要在項目(mu)里面勾上 ES5轉(zhuan)ES6



接下來修改logs.wxml來顯示我們要傳過去的參數。
 <view class="usermotto">
    <text class="user-motto">{{twomotto}}</text>
  </view>
當然,你需要先在logs.js里面對穿過來的參數進行處理。
Page({
  data: {

  },
  onLoad: function (options) {
     this.setData({
      twomotto: options.motto
    })
  }
})


易優小程序(企業版(ban))+靈(ling)活api+前后代碼開(kai)源(yuan) 碼云倉庫:
本文地址://www.jinyoudianli.com/wxmini/doc/course/25891.html 復制鏈接 如需定制請聯系易優客服咨詢(xun):

工作日 8:30-12:00 14:30-18:00
周六及(ji)部分節假(jia)日提供(gong)值(zhi)班服務

易小優
轉人工(gong) ×