這篇文章主要介紹了小程序中wepy-redux的使用以及存儲(chǔ)全局變量,具有一定借鑒價(jià)值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
十年的錫林浩特網(wǎng)站建設(shè)經(jīng)驗(yàn),針對(duì)設(shè)計(jì)、前端、開(kāi)發(fā)、售后、文案、推廣等六對(duì)一服務(wù),響應(yīng)快,48小時(shí)及時(shí)工作處理。全網(wǎng)營(yíng)銷(xiāo)推廣的優(yōu)勢(shì)是能夠根據(jù)用戶(hù)設(shè)備顯示端的尺寸不同,自動(dòng)調(diào)整錫林浩特建站的顯示方式,使網(wǎng)站能夠適用不同顯示終端,在瀏覽器中調(diào)整網(wǎng)站的寬度,無(wú)論在任何一種瀏覽器上瀏覽網(wǎng)站,都能展現(xiàn)優(yōu)雅布局與設(shè)計(jì),從而大程度地提升瀏覽體驗(yàn)。創(chuàng)新互聯(lián)從事“錫林浩特網(wǎng)站設(shè)計(jì)”,“錫林浩特網(wǎng)站推廣”以來(lái),每個(gè)客戶(hù)項(xiàng)目都認(rèn)真落實(shí)執(zhí)行。wepy里推薦使用wepy-redux存儲(chǔ)全局變量
// app.wpy import { setStore } from 'wepy-redux' import configStore from './store' const store = configStore() setStore(store) //setStore是將store注入到所有頁(yè)面中
// store文件夾下的index.js import { createStore, applyMiddleware } from 'redux' import promiseMiddleware from 'redux-promise' import rootReducer from './reducers' export default function configStore () { const store = createStore(rootReducer, applyMiddleware(promiseMiddleware)) //生成一個(gè) store 對(duì)象 return store }
applyMiddleware 函數(shù)的作用就是對(duì) store.dispatch 方法進(jìn)行增強(qiáng)和改造
這里就是使用redux-promise來(lái)解決異步
import { getStore } from 'wepy-redux' const store = getStore() // dispatch store.dispatch({type: 'xx', payload: data}) //xx是reducer名字 payload就是攜帶的數(shù)據(jù) store.dispatch(getAllHoomInfo(store.getState().base)) //xx是action名字 //獲取state const state = store.getState()
@connect({ data:(state) => state.base.data //注意這里是base下的state 所有要加上base. })
types里是觸發(fā)action的函數(shù)名稱(chēng) 只是存儲(chǔ)函數(shù)名字
按照模塊去創(chuàng)建type.js
//base.js export const GETALLHOMEINFO = 'GETALLHOMEINFO'
寫(xiě)好了函數(shù)名稱(chēng) 在index.js中export出來(lái)
export * from './counter' export * from './base'
隨著應(yīng)用變得復(fù)雜,需要對(duì) reducer 函數(shù) 進(jìn)行拆分,拆分后的每一塊獨(dú)立負(fù)責(zé)管理 state 的一部分
這個(gè)時(shí)候多個(gè)模塊的reducer通過(guò)combineReducers合并成一個(gè)最終的 reducer 函數(shù),
import { combineReducers } from 'redux' import base from './base' import counter from './counter' export default combineReducers({ base, counter })
模塊使用handleActions 來(lái)處理reducer,將多個(gè)相關(guān)的reducers寫(xiě)在一起
handleActions有兩個(gè)參數(shù):第一個(gè)是多個(gè)reducers,第二個(gè)是初始state
GETALLHOMEINFO reducer是將異步action返回的值賦值給data
//base.js import { handleActions } from 'redux-actions' import { GETALLHOMEINFO } from '../types/base' const initialState = { data: {} } export default handleActions({ [GETALLHOMEINFO] (state, action) { return { ...state, data: action.payload } } }, initialState)
actions是對(duì)數(shù)據(jù)的處理
在index.js中export出來(lái)
export * from './counter' export * from './base'
createAction用來(lái)創(chuàng)建Action的
import { GETALLHOMEINFO } from '../types/base' import { createAction } from 'redux-actions' import { Http, Apis } from '../../libs/interface' export const getAllHoomInfo = createAction(GETALLHOMEINFO, (base) => { return new Promise(async resolve => { let data = await Http.get({ url: Apis.ls_url + Apis.allHomeInfo, data: {} }) resolve(data)**//返回到reduer的action.payload** }) })
<script> import wepy from 'wepy' import { connect } from 'wepy-redux' import { getAllHoomInfo } from '../store/actions/base.js'// 引入action方法 import { getStore } from 'wepy-redux' const store = getStore() @connect({ data:(state) => state.base.data }) export default class Index extends wepy.page { data = { } computed = { } onLoad() { store.dispatch(getAllHoomInfo(store.getState().base)) } } </script>
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“小程序中wepy-redux的使用以及存儲(chǔ)全局變量”這篇文章對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司,,關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!
本文題目:小程序中wepy-redux的使用以及存儲(chǔ)全局變量-創(chuàng)新互聯(lián)
URL地址:http://muchs.cn/article22/dsjpjc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供云服務(wù)器、外貿(mào)網(wǎng)站建設(shè)、網(wǎng)站維護(hù)、網(wǎng)站設(shè)計(jì)、響應(yīng)式網(wǎng)站、網(wǎng)站制作
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容
營(yíng)銷(xiāo)型網(wǎng)站建設(shè)知識(shí)