微信小程序之頁(yè)面?zhèn)髦档氖纠?/h1>

發(fā)布時(shí)間：2021-01-29 10:09:07 來(lái)源：億速云 閱讀：124 作者：小新 欄目：移動(dòng)開發(fā)

這篇文章主要介紹微信小程序之頁(yè)面?zhèn)髦档氖纠闹薪榻B的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

最近組里開發(fā)小程序，遇到了一個(gè)前端亙古不變的話題：頁(yè)面?zhèn)髦?br/>剛開始使用路徑傳參解決，但是眾所周知：

各瀏覽器HTTP Get請(qǐng)求URL最大長(zhǎng)度并不相同，幾類常用瀏覽器最大長(zhǎng)度及超過(guò)最大長(zhǎng)度后提交情況如下：
IE6.0 :url最大長(zhǎng)度2083個(gè)字符，超過(guò)最大長(zhǎng)度后無(wú)法提交。
IE7.0 :url最大長(zhǎng)度2083個(gè)字符，超過(guò)最大長(zhǎng)度后仍然能提交，但是只能傳過(guò)去2083個(gè)字符。
firefox 3.0.3 :url最大長(zhǎng)度7764個(gè)字符，超過(guò)最大長(zhǎng)度后無(wú)法提交。
Opera 9.52 :url最大長(zhǎng)度7648個(gè)字符，超過(guò)最大長(zhǎng)度后無(wú)法提交。
Google Chrome 2.0.168 :url最大長(zhǎng)度7713個(gè)字符，超過(guò)最大長(zhǎng)度后無(wú)法提交。

所以覺得不靠譜。
研究了一下官網(wǎng)，發(fā)現(xiàn)有兩種方式可以“比較優(yōu)雅”地干這件事，當(dāng)然不能和vuex/flux比。

1. 使用全局變量
   在項(xiàng)目app.js中定義globalData

   App({
    globalData:{
    userInfo:'angeladaddy'
   }
   });

   在需要的地方使用：

   getGlobalVar:function(){
    var that=this;
   that.setData({
     globalvar_str:JSON.stringify(getApp().globalData)
   }) 
   }

   當(dāng)然也可以隨時(shí)賦值：

   onLoad:function(options){
    getApp().globalData.userInfo+=' is an awesome man';
   },

   效果：

Paste_Image.png

2.使用模板
根據(jù)官方介紹如下：

首先定義模板,使用name屬性

<template name="msgItem">
  <view>
    <text> {{index}}: {{msg}} </text>
    <text> Time: {{time}} </text>
  </view>
</template>

接著，使用模板

• 使用 is 屬性，聲明需要的使用的模板，然后將模板所需要的 data 傳入，如：

  <template is="msgItem" data="{{...item}}"/>

  給item賦值以顯示模板數(shù)據(jù)

  Page({
  data: {
   item: {
     index: 0,
     msg: 'this is a template',
     time: '2016-09-15'
   }
  }
  })

以上是“微信小程序之頁(yè)面?zhèn)髦档氖纠边@篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！