Redux 信息完善交互

交互需求：完善信息页面后台交互，redux发送更新数据请求，实现异步更新状态树的用户数据，在每次进入完善信息页面时，检测是否已经完成信息补充，如果已完成，直接跳转到状态树上的路由地址，如过没有，就留在当前页面，补充信息成功提交到数据库后才能根据状态树跳转到对应的路由地址。

核心代码：

（1）点击按钮，执行redux中的update方法：

<Button onClick={ v => { this.props.push(this.state) } }>确定</Button>

（2）执行update方法，向数据库发出更新请求：

export function update(data){
    return dispatch => {
        axios.post('/user/update',data).then(res=>{
            if(res.status === 200 && res.data.code === 0){
                //success
                dispatch(authSuccess(res.data))
            }else{
                //fail
                dispatch(errorMsg(res.data.msg));
            }
        })
    }
}

（3）请求成功后，更新状态树：

export function user(state=initState,action){
    switch(action.type){
        case AUTH_SUCCESS:
            return {...state,redirect:getRedirect(action.payload),msg:'',...action.payload};
        //……
        default:
            return state;
    }
}

（4）状态树更新后，判断 this.props.redirect 是否有值，有值就跳转路由

 

{ this.props.redirect ? <Redirect to={this.props.redirect}></Redirect> : null }

2. 用户（客户）信息、 登录后跳转页面 （ 类似于上面的操作 ）

3. 所用到的相关前端知识点：

  3-1. 数据库查找并且更新：

Model.findByIdAndUpdate( id, data, (err,docs)=>{ …… } )

  3-2. 相关常用mongoose查询数据库方法：

1. Model.find()

    //(1)
    MyModel.find({ name: 'john', age: { $gte: 18 }}, function (err, docs) {});

    //(2)
    var query = MyModel.find({ name: /john/i }, null, { skip: 10 });
    var promise = query.exec();
    promise.addBack(function (err, docs) {});

2. Model.findById()

    //(1)
    Adventure.findById(id, 'name length', function (err, adventure) {});

    //(2) 
    Adventure.findById(id, 'name', { lean: true }, function (err, doc) {});

3.
Model.findByIdAndDelete()
Model.findByIdAndRemove()
Model.findByIdAndUpdate()

    /*
        Parameters:
        id «Object|Number|String» value of _id to query by
        [options] «Object» optional see Query.prototype.setOptions()
        [callback] «Function»
    */   

4. Model.findOne()

    Adventure.findOne({ type: 'iphone' }, function (err, adventure) {});

5. Model.findOneAndDelete()

    A.findOneAndDelete(conditions, [options,] callback) // executes

6. Model.findOneAndRemove()

    A.findOneAndRemove(conditions, [options,] callback) // executes

7. Model.findOneAndUpdate()

    var query = { name: 'borne' };
    Model.findOneAndUpdate(query, { name: 'jason bourne' }, [options,] callback)

4. react相关绑定事件的几种方式：（ 注意函数体作用域 ）

<button onClick={this.handleClick.bind(this,’test')}>Test</button>
<button onClick={::this.handleClick}>Test</button>
<button onClick={this.handleClick}>Test</button>
<button onClick={()=>this.handleClick()}>Test</button>