微信小程序頁面?zhèn)髦祵?shí)例分析
更新時間：2017年04月19日 10:58:47 作者：Angeladaddy
這篇文章主要介紹了微信小程序頁面?zhèn)髦祵?shí)例分析的相關(guān)資料,需要的朋友可以參考下
微信小程序頁面?zhèn)髦祵?shí)例分析
最近組里開發(fā)小程序，遇到了一個前端亙古不變的話題：頁面?zhèn)髦?br />
剛開始使用路徑傳參解決，但是眾所周知：
各瀏覽器HTTP Get請求URL最大長度并不相同，幾類常用瀏覽器最大長度及超過最大長度后提交情況如下： IE6.0 :url最大長度2083個字符，超過最大長度后無法提交。 IE7.0 :url最大長度2083個字符，超過最大長度后仍然能提交，但是只能傳過去2083個字符。 firefox 3.0.3 :url最大長度7764個字符，超過最大長度后無法提交。 Opera 9.52 :url最大長度7648個字符，超過最大長度后無法提交。 Google Chrome 2.0.168 :url最大長度7713個字符，超過最大長度后無法提交。
所以覺得不靠譜。
研究了一下官網(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)然也可以隨時賦值：
onLoad:function(options){
getApp().globalData.userInfo+=' is an awesome man';
},
效果：
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'
}
}
})
這樣就一下解決了頁面?zhèn)髦祮栴}
后記：既然小程序可以使用ES6的所有特性，那么那個var that=this又是什么鬼？為何不能用箭頭函數(shù)解決作用域問題？回頭再試試。
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
您可能感興趣的文章:
- 微信小程序 頁面?zhèn)髦翟斀?/a>
- 微信小程序?qū)崿F(xiàn)頁面跳轉(zhuǎn)傳值以及獲取值的方法分析
- 微信小程序自定義組件傳值 頁面和組件相互傳數(shù)據(jù)操作示例
- 微信小程序中子頁面向父頁面?zhèn)髦祵?shí)例詳解
- 微信小程序 頁面跳轉(zhuǎn)如何實(shí)現(xiàn)傳值
- 微信小程序?qū)崿F(xiàn)兩個頁面?zhèn)髦档姆椒ǚ治?/a>
- 微信小程序頁面間傳值與頁面取值操作實(shí)例分析
- 微信小程序 頁面跳轉(zhuǎn)傳值實(shí)現(xiàn)代碼
- 微信小程序?qū)崿F(xiàn)頁面跳轉(zhuǎn)傳值的方法
- 微信小程序頁面間傳值的實(shí)現(xiàn)方法示例
相關(guān)文章
這篇文章主要給大家分享的是TypeScript 索引簽名的理解，索引簽名由方括號中的索引名稱及其類型組成，后面是冒號和值類型：{ [indexName: KeyType]: ValueType }， KeyType 可以是一個 string、number 或 symbol，而ValueType 可以是任何類型，下面就倆簡單了解一下吧2021-10-10
TS?項(xiàng)目中高效處理接口返回數(shù)據(jù)方法詳解
這篇文章主要為大家介紹了TS?項(xiàng)目中如何高效的處理接口返回的數(shù)據(jù)的方法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-01-01
微信小程序上滑加載下拉刷新（onscrollLower）分批加載數(shù)據(jù)（二）
這篇文章主要介紹了微信小程序上滑加載下拉刷新（onscrollLower）分批加載數(shù)據(jù)的相關(guān)資料,需要的朋友可以參考下2017-05-05
這篇文章主要為大家介紹了微前端之Web組件自定義元素示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
這篇文章主要介紹了微信小程序 生命周期和頁面的生命周期詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下2017-01-01
這篇文章主要介紹了?如何利用JavaScript寫一個簡單計算器，利用JavaScript寫一個簡單計算器算是一個簡單的小練習(xí)吧，需要的小伙伴可以參考一下<BR>2021-11-11
這篇文章主要介紹如何用JS寫一個發(fā)布訂閱模式，什么是發(fā)布訂閱模式？能手寫實(shí)現(xiàn)一下嗎？它和觀察者模式有區(qū)別嗎？帶著疑惑一起解開下面文章的內(nèi)容吧2021-11-11
兩表格傳遞變量...2006-06-06
這篇文章主要為大家介紹了JS作用域作用鏈及this使用原理詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08
JavaScript實(shí)現(xiàn)一個Promise隊(duì)列小工具
這篇文章主要介紹了JavaScript實(shí)現(xiàn)一個Promise隊(duì)列小工具，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-08-08