這篇文章給大家分享的是有關(guān)微信小程序中如何實現(xiàn)Redux綁定的內(nèi)容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
微信小程序Redux綁定實例
安裝
clone或者下載代碼庫到本地:
git clone https://github.com/charleyw/wechat-weapp-redux
將dist/wechat-weapp-redux.js(或者拷貝minify的也可以)文件直接拷貝到小程序的工程中,例如(下面假設(shè)我們把第三方包都安裝在libs目錄下):
cd wechat-weapp-redux cp -r dist/wechat-weapp-redux.js <小程序根目錄>/libs
上面的命令將包拷貝到小程序的libs目錄下
使用
1.將Redux Store綁定到App上。
const store = createStore(reducer) // redux store const WeAppRedux = require('./libs/wechat-weapp-redux/index.js'); const {Provider} = WeAppRedux;
Provider是用來把Redux的store綁定到App上。
App(Provider(store)({ onLaunch: function () { console.log("onLaunch") } }))
provider的實現(xiàn)只是簡單的將store加到App這個global對象上,方便在頁面中用getApp取出來
上面這段代碼等同于:
App({ onLaunch: function() { console.log( "onLaunch" ) }, store: store })
2.在頁面的定義上使用connect,綁定redux store到頁面上。
const pageConfig = { data: { }, ... }
頁面的定義
const mapStateToData = state => ({ todos: state.todos, visibilityFilter: state.visibilityFilter })
定義要映射哪些state到頁面
const mapDispatchToPage = dispatch => ({ setVisibilityFilter: filter => dispatch(setVisibilityFilter(filter)), toggleTodo: id => dispatch(toggleTodo(id)), addTodo: text => dispatch(addTodo(text)), })
定義要映射哪些方法到頁面
const nextPageConfig = connect(mapStateToData, mapDispatchToPage)(pageConfig)
使用connect將上述定義添加到pageConfig中。
Page(nextPageConfig);
注冊小程序的頁面
3.說明
完成上述兩步之后,你就可以在this.data中訪問你在mapStateToData定義的數(shù)據(jù)了。
mapDispatchToPage定義的action會被映射到this對象上。
感謝各位的閱讀!關(guān)于“微信小程序中如何實現(xiàn)Redux綁定”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學(xué)到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)建站m.rwnh.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
網(wǎng)站欄目:微信小程序中如何實現(xiàn)Redux綁定-創(chuàng)新互聯(lián)
當前鏈接:http://m.rwnh.cn/article46/dcehhg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供軟件開發(fā)、網(wǎng)頁設(shè)計公司、微信公眾號、網(wǎng)站收錄、品牌網(wǎng)站建設(shè)、搜索引擎優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容