周大胖子 发表于 2021-2-25 09:54:51

Remax 实际开发种的使用

本帖最后由 周大胖子 于 2021-2-25 15:45 编辑

1. 判断登录状态,未登录跳转登录页 ;[ 也就是判断token,且这个token为全局数据 ]纵观全局 ,这样最方便
import * as React from 'react';
import { View } from 'remax/one';
import store from '../../store/Store';
import { funGetNewsList } from '../../store/ActionCreator';
import { navigateTo} from 'remax/wechat';
import { redirectTo } from 'remax/one';
let LoginUrl = '../login/login';

class Shop extends React.Component{
    constructor(props) {
      super(props);

      // 接收所有数据,然后进行过滤,取出新闻的部分
      let allStore = store.getState();
      this.state = allStore;
      this.change = this.change.bind(this);
      this.lmStoreChange = this.lmStoreChange.bind(this);
      this.m =1;
      // console.log( allStore )
      // 当我写在 change 里时,store.subscribe 会产生多个BUG 但是在这里却正常?
      store.subscribe( this.lmStoreChange ) ;
    }

    componentDidMount(){
      if( this.state.token ){
            console.log( ' 这是已经登录了' );

      }else{
            redirectTo({
                url: LoginUrl
            })
            console.log( '跳转到登录页' )
      }

    }   

    lmStoreChange(){
      this.m++
      console.log(this.m)
      console.log( '进入了lmStoreChange 方法')

      // 接收所有数据,然后进行过滤,取出新闻的部分
      let allStore = store.getState();
      this.setState( allStore );

    }
    // 改变值
    change(){
      store.dispatch( funGetNewsList() );
      console.log('执行了dispatch方法' )

      // 第一次点击时,先执行了 dispatch 未执行subscribe
      // 第二次点击时, 先执行了subscribe ,再执行 change方法
      
      //最后一步订阅
      // store.subscribe( this.lmStoreChange ) ;
      // store.subscribe( this.lmStoreChange() );这样有效果 但是报错
      // store.subscribe(()=>{
      //   console.log('进入了subscribe方法')
      //   this.lmStoreChange()
      // })

    }

    componentWillUnmount = () => {
      this.setState = (state, callback) => {
            return;
      };
    }

    render(){
      return(
            <View >
                这是商品界面 { this.state.name }
               
                <View onTap={ this.change } > 点我变 </View>

            </View>
      );
    }

}

export default Shop;
页: [1]
查看完整版本: Remax 实际开发种的使用