alibaba / fish-redux

An assembled flutter application framework.
https://github.com/alibaba/fish-redux
Apache License 2.0
7.33k stars 843 forks source link

自定义 component 使用 dispatch报错 #711

Open wangemng opened 4 years ago

wangemng commented 4 years ago

enum HomeBaseGoodsAction { action }

class HomeBaseGoodsActionCreator { static Action onAction() { return const Action(HomeBaseGoodsAction.action); } }

在 view页面调用dispatch(HomeBaseGoodsActionCreator.onAction())

在 effect 不会 然后在 reducer.dart 里面接收的时候就会报错

这是我的根 page 页面 WX20200822-154825

这是我的Connector页面 image

这是我的Component 页面 image

image

求结局

zsfbest commented 4 years ago

报错还不明显吗, called on null

wangemng commented 4 years ago

@zsfbest 你有例子吗 借我看一下呗 这困扰我太久了 我自动生成一个 component 在 view 中调用 dispath 就报错

zsfbest commented 4 years ago

@zsfbest 你有例子吗 借我看一下呗 这困扰我太久了 我自动生成一个 component 在 view 中调用 dispath 就报错

你去把官方的例子看一遍就懂了

wangemng commented 4 years ago

@zsfbest你有例子吗借我看一下呗这损坏我太久了我自动生成一个component在视图中调用dispath就报错

你去把官方的例子看一遍就懂了

我看了 感觉没问题阿 我估计就是 connector 有的问题 但是看着没啥毛病阿 醉了

zsfbest commented 4 years ago

@zsfbest你有例子吗借我看一下呗这损坏我太久了我自动生成一个component在视图中调用dispath就报错

你去把官方的例子看一遍就懂了

我看了 感觉没问题阿 我估计就是 connector 有的问题 但是看着没啥毛病阿 醉了

你把你完整的贴出来直接帮你改了

wangemng commented 4 years ago

以下我的 components action

` import 'package:fish_redux/fish_redux.dart';

//TODO replace with your own action enum HomeActivityAction { action }

class HomeActivityActionCreator { static Action onAction() { return const Action(HomeActivityAction.action); } }

` component

`import 'package:fish_redux/fish_redux.dart';

import 'effect.dart'; import 'reducer.dart'; import 'state.dart'; import 'view.dart';

class HomeActivityComponent extends Component { HomeActivityComponent() : super( effect: buildEffect(), reducer: buildReducer(), view: buildView, dependencies: Dependencies( adapter: null, slots: <String, Dependent>{ }),);

} `

effect

`import 'package:fish_redux/fish_redux.dart'; import 'action.dart'; import 'state.dart';

Effect buildEffect() { return combineEffects(<Object, Effect>{ // HomeActivityAction.action: _onAction, }); }

// void _onAction(Action action, Context ctx) { // } `

reducer

`import 'package:fish_redux/fish_redux.dart';

import 'action.dart'; import 'state.dart';

Reducer buildReducer() { return asReducer( <Object, Reducer>{ HomeActivityAction.action: _onAction, }, ); }

HomeActivityState _onAction(HomeActivityState state, Action action) { final HomeActivityState newState = state.clone(); print("object"); return newState; } ` state

`import 'package:fish_redux/fish_redux.dart';

class HomeActivityState implements Cloneable { String imageName; @override HomeActivityState clone() { return HomeActivityState()..imageName= imageName; } }

HomeActivityState initState(Map<String, dynamic> args) {

return HomeActivityState();

} ` view

`import 'package:fish_redux/fish_redux.dart'; import 'package:flutter/material.dart';

import 'action.dart'; import 'state.dart';

Widget buildView( HomeActivityState state, Dispatch dispatch, ViewService viewService) { return Container( child: InkWell( onTap: (){ print("sss"); dispatch(HomeActivityActionCreator.onAction()); }, child: Image.network( state.imageName, fit: BoxFit.cover, ), ), ); } `

connector

`import 'package:fish_redux/fish_redux.dart'; import 'package:rainbow_full/pages/home_page/components/home_activity_component/state.dart'; import 'package:rainbow_full/pages/home_page/state.dart';

class HomeActivityConnector extends ConnOp<HomePageState, HomeActivityState> { @override HomeActivityState get(HomePageState state) { HomeActivityState mstate = HomeActivityState();

return mstate;

} }`

'home_activity1': HomeActivityConnector() + HomeActivityComponent(),

然后我在 HomePage 中添加这个 component,通过 viewService.buildComponent('home_activity1'),

`class HomePage extends Page<HomePageState, Map<String, dynamic>> { HomePage() : super( initState: initState, effect: buildEffect(), reducer: buildReducer(), view: buildView, dependencies: Dependencies( adapter: null, slots: <String, Dependent>{ 'home_activity1': HomeActivityConnector() + HomeActivityComponent(),

          }),
      middleware: <Middleware<HomePageState>>[],
    );

} `

wangemng commented 4 years ago

微信 63289734

hfbi360 commented 4 years ago

以下我的 components action

` import 'package:fish_redux/fish_redux.dart';

//TODO replace with your own action enum HomeActivityAction { action }

class HomeActivityActionCreator { static Action onAction() { return const Action(HomeActivityAction.action); } }

` component

`import 'package:fish_redux/fish_redux.dart';

import 'effect.dart'; import 'reducer.dart'; import 'state.dart'; import 'view.dart';

class HomeActivityComponent extends Component { HomeActivityComponent() : super( effect: buildEffect(), reducer: buildReducer(), view: buildView, dependencies: Dependencies( adapter: null, slots: <String, Dependent>{ }),);

} `

effect

`import 'package:fish_redux/fish_redux.dart'; import 'action.dart'; import 'state.dart';

Effect buildEffect() { return combineEffects(<Object, Effect>{ // HomeActivityAction.action: _onAction, }); }

// void _onAction(Action action, Context ctx) { // } `

reducer

`import 'package:fish_redux/fish_redux.dart';

import 'action.dart'; import 'state.dart';

Reducer buildReducer() { return asReducer( <Object, Reducer>{ HomeActivityAction.action: _onAction, }, ); }

HomeActivityState _onAction(HomeActivityState state, Action action) { final HomeActivityState newState = state.clone(); print("object"); return newState; } ` state

`import 'package:fish_redux/fish_redux.dart';

class HomeActivityState implements Cloneable { String imageName; @override HomeActivityState clone() { return HomeActivityState()..imageName= imageName; } }

HomeActivityState initState(Map<String, dynamic> args) {

return HomeActivityState();

} ` view

`import 'package:fish_redux/fish_redux.dart'; import 'package:flutter/material.dart';

import 'action.dart'; import 'state.dart';

Widget buildView( HomeActivityState state, Dispatch dispatch, ViewService viewService) { return Container( child: InkWell( onTap: (){ print("sss"); dispatch(HomeActivityActionCreator.onAction()); }, child: Image.network( state.imageName, fit: BoxFit.cover, ), ), ); } `

connector

`import 'package:fish_redux/fish_redux.dart'; import 'package:rainbow_full/pages/home_page/components/home_activity_component/state.dart'; import 'package:rainbow_full/pages/home_page/state.dart';

class HomeActivityConnector extends ConnOp<HomePageState, HomeActivityState> { @override HomeActivityState get(HomePageState state) { HomeActivityState mstate = HomeActivityState();

return mstate;

} }`

'home_activity1': HomeActivityConnector() + HomeActivityComponent(),

然后我在 HomePage 中添加这个 component,通过 viewService.buildComponent('home_activity1'),

`class HomePage extends Page<HomePageState, Map<String, dynamic>> { HomePage() : super( initState: initState, effect: buildEffect(), reducer: buildReducer(), view: buildView, dependencies: Dependencies( adapter: null, slots: <String, Dependent>{ 'home_activity1': HomeActivityConnector() + HomeActivityComponent(),

          }),
      middleware: <Middleware<HomePageState>>[],
    );

} `

connector 需要实现 set方法,可以参考下#653

wangemng commented 4 years ago

以下我的component action import'package:fish_redux / fish_redux.dart'; //将待办事项替换为您自己的动作 枚举HomeActivityAction {action} 类HomeActivityActionCreator { 静态Action onAction(){ 返回const Action(HomeActivityAction.action); } } 组件 import'package:fish_redux / fish_redux.dart'; 导入'effect.dart'; 导入'reducer.dart'; 导入'state.dart'; 导入'view.dart'; 类HomeActivityComponent扩展了组件{ HomeActivityComponent() :super( 效果:buildEffect(), reducer:buildReducer(), view:buildView, 依赖项:Dependencies( 适配器:null, 插槽:<String,Dependent> { }),); } 影响 import'package:fish_redux / fish_redux.dart'; 导入'action.dart'; 导入'state.dart'; 效果buildEffect(){ return CombineEffects(<Object,Effect> { // HomeActivityAction.action:_onAction, }); } // void _onAction(Action action,Context ctx){ //} 减速器 import'package:fish_redux / fish_redux.dart'; 导入'action.dart'; 导入'state.dart'; Reducer buildReducer(){ 返回asReducer( <Object,Reducer> { HomeActivityAction.action:_onAction, }, ); } HomeActivityState _onAction(HomeActivityState state,Action action){ final HomeActivityState newState = state.clone(); print(“ object”); 返回newState; } 状态 `import'package:fish_redux / fish_redux.dart'; HomeActivityState类实现Cloneable { String imageName; @override HomeActivityState clone(){ return HomeActivityState().. imageName = imageName; } } HomeActivityState initState(Map <String,dynamic> args){

return HomeActivityState();

} 视图 import'package:fish_redux / fish_redux.dart'; 导入'package:flutter / material.dart'; 导入'action.dart'; 导入'state.dart'; 窗口小部件buildView( HomeActivityState状态,调度调度,ViewService viewService){ 返回容器( 子:墨水瓶( 中的onTap:(){ 打印( “SSS”); 调度(HomeActivityActionCreator.onAction()); }, 小孩:Image.network( 状态.imageName, 适合:BoxFit.cover, ), ), ); } 连接器 import'package:fish_redux / fish_redux.dart'; 导入'package:rainbow_full / pages / home_page / components / home_activity_component / state.dart'; 导入'package:rainbow_full / pages / home_page / state.dart'; 类HomeActivityConnector扩展ConnOp <HomePageState,HomeActivityState> { @override HomeActivityState get(HomePageState state){ HomeActivityState mstate = HomeActivityState();

return mstate;

} } 'home_activity1': HomeActivityConnector() + HomeActivityComponent(), 然后我在HomePage中添加这个组件,通过viewService.buildComponent('home_activity1'), Class HomePage扩展Page <HomePageState,Map <String,dynamic >> { HomePage() :super( initState:initState, effect:buildEffect(), reducer:buildReducer(), view:buildView, 依赖项:Dependencies( 适配器:null, 插槽:<String,Dependent> { 'home_activity1':HomeActivityConnector()+ HomeActivityComponent(),

          }),
      middleware: <Middleware<HomePageState>>[],
    );

} `

连接器需要实现set方法,可以参考下#653

能否给个示例代码 看一下 connector 看一下 我添加 set 方法也不对哦。。。是在 connector 中实现 set 方法吗? 把子组建要实现的值写在 set 方法中吗?