微信小程序Redux绑定
==============
用于在微信小程序为页面绑定Redux Store。
_PS: 代码是基于[react-redux](https://github.com/reactjs/react-redux)修改的_
## 安装
1. clone或者下载代码库到本地:
```shell
git clone https://github.com/charleyw/wechat-weapp-redux
```
2. 将`dist/wechat-weapp-redux.js`(或者拷贝minify的也可以)文件直接拷贝到小程序的工程中,例如(下面假设我们把第三方包都安装在libs目录下):
``` shell
cd wechat-weapp-redux
cp -r dist/wechat-weapp-redux.js <小程序根目录>/libs
```
上面的命令将包拷贝到小程序的`libs`目录下
## 使用
1. 将Redux Store绑定到App上。
```js
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的实现只是简单的将store加到App这个global对象上,方便在页面中用getApp取出来
上面这段代码等同于:
```
App({
onLaunch: function() {
console.log( "onLaunch" )
},
store: store
})
```
2. 在页面的定义上使用connect,绑定redux store到页面上。
```js
const pageConfig = {
data: {
},
...
}
```
页面的定义
```js
const mapStateToData = state => ({
todos: state.todos,
visibilityFilter: state.visibilityFilter
})
```
定义要映射哪些state到页面
```js
const mapDispatchToPage = dispatch => ({
setVisibilityFilter: filter => dispatch(setVisibilityFilter(filter)),
toggleTodo: id => dispatch(toggleTodo(id)),
addTodo: text => dispatch(addTodo(text)),
})
```
定义要映射哪些方法到页面
```js
const nextPageConfig = connect(mapStateToData, mapDispatchToPage)(pageConfig)
```
使用connect将上述定义添加到pageConfig中。
```js
Page(nextPageConfig);
```
注册小程序的页面
3. 说明
完成上述两步之后,你就可以在`this.data`中访问你在`mapStateToData`定义的数据了。
`mapDispatchToPage`定义的action会被映射到`this`对象上。
## Example
详细的使用例子可以参照: [wechat-weapp-redux-todos](https://github.com/charleyw/wechat-weapp-redux-todos)
真机实测版请clone下面这个repo,用小程序开发工具开启预览:
```
git clone -b release https://github.com/charleyw/wechat-weapp-redux-todos.git
```
没有合适的资源?快使用搜索试试~ 我知道了~
微信小程序源代码模板-LOL战绩查询movecss效果Railay:整体框架redux绑定TCP,IP长连接.zip
共295个文件
png:115个
js:49个
wxss:31个
0 下载量 87 浏览量
2023-12-22
11:04:05
上传
评论
收藏 14.82MB ZIP 举报
温馨提示
含源代码
资源推荐
资源详情
资源评论
收起资源包目录
微信小程序源代码模板-LOL战绩查询movecss效果Railay:整体框架redux绑定TCP,IP长连接.zip (295个子文件)
.babelrc 113B
3123.gif 5.04MB
1.gif 5.04MB
lolgame.gif 1.1MB
lolgame.gif 1.1MB
lolgame-fuzzy.gif 362KB
lolgame-fuzzy.gif 362KB
.gitignore 607B
.gitignore 20B
handler.go 2KB
msg.go 706B
sendUserInfo.go 647B
module.go 573B
sendHello.go 572B
chanrpc.go 426B
json.go 392B
reader.go 379B
router.go 368B
skeleton.go 359B
conf.go 324B
main.go 307B
module.go 285B
module.go 285B
handler.go 156B
external.go 120B
external.go 118B
external.go 89B
index.html 8KB
更多免费资源.jpg 66KB
更多免费资源.jpg 66KB
更多免费资源.jpg 66KB
更多免费资源.jpg 66KB
更多免费资源.jpg 66KB
profile_header.jpg 17KB
encoding.js 92KB
reconnecting-websocket.js 14KB
wechat-weapp-redux.js 9KB
userinfo.js 9KB
detail.js 7KB
fuzzy.js 4KB
battledetail.js 4KB
wechat-weapp-redux.min.js 3KB
test.js 3KB
app.js 3KB
index.js 3KB
index.js 3KB
rank.js 3KB
hero.js 3KB
data.js 2KB
util.js 2KB
connect.js 2KB
search.js 2KB
index.js 2KB
detail.js 1KB
wrapActionCreators.js 1KB
index.js 1KB
app.js 1KB
app.js 852B
index.js 746B
index.js 729B
app.js 726B
index.js 722B
webpack.config.js 720B
index.js 711B
area.js 688B
Object.js 686B
hero_free.js 659B
warning.js 646B
encoding.js 634B
index.js 591B
rankdetail.js 590B
herodetail.js 586B
Provider.js 558B
shallowEqual.js 504B
play.js 464B
api.js 461B
util.js 460B
util.js 460B
util.js 460B
result.js 402B
logs.js 266B
logs.js 266B
index.js 134B
app.json 1KB
app.json 1KB
app.json 1KB
package.json 1004B
app.json 241B
rankdetail.json 93B
herodetail.json 93B
hero.json 93B
data.json 93B
hero_free.json 90B
rank.json 85B
battledetail.json 83B
search.json 63B
userinfo.json 57B
logs.json 54B
logs.json 54B
detail.json 48B
共 295 条
- 1
- 2
- 3
资源评论
用数据说话用数据决策
- 粉丝: 3504
- 资源: 6440
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功