组件中使用事件函数

版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/u013003052/article/details/88832886


ReactNative系列-文章

组件中使用事件函数

如何将父组件的函数作为props传递给子组件

简单样例:

class Foo extends Component {handleClick() {
    // todo
  }
  render() {
    return(
      <Button onClick={this.handleClick}/>
    )
  }
}

当子组件被点击的时候,父组件的handleClick函数被触发。

一般来说,需要在父组件的构造函数中对传递的函数进行绑定。正确的做法是这样,将上述代码改为:

class Foo extends Component {
  constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }
  handleClick() {
    // todo
  }
  render() {
    return(
      <Button onClick={this.handleClick}/>
    )
  }
}

知识点:

1. 为什么不是直接调用函数:

<Button onClick={this.handleClick()}/>

因为这种方式实际是调用函数,当每次组件渲染的时候函数都会被调用。所以需要确保你传递的是函数本身。

2. 为什么需要bind(this):

this.handleClick = this.handleClick.bind(this);

因为当函数作为props传递到子组件的时候,会出现函数内this丢失的情况,实际上函数内的this已经不再指向原有的父组件。所以在构造函数里,需要执行这段代码进行函数与父组件的绑定。

3. 为什么不在组件中进行绑定:

class Foo extends Component {
  constructor(props) {
    super(props);
  }
  handleClick() {
    // todo
  }
  render() {
    return(
      <Button onClick={this.handleClick.bind(this)}/>
    )
  }
}

因为在render方法中使用bind函数也会在每次组件渲染时创建一个新的函数,可能会影响性能。

展开阅读全文

组件中的事件怎么处理?

09-24

事情描述:rn应用程序主体是由Java编写,有一个外设是PDA,需要将它的数据传输到数据库中或者从数据库中取得数据。rn rnPDA厂商提供了一个COM组件,它有几个接口函数来控制PDA上传或者下载数据。rn rn我写了一个动态连接库(DLL),它的功能就是完成将PDA中的数据上传到本地PC形成文件,和取本地文件送到PDA中,DLL里面调用了这个COM组件。rn rnCOM组件通过包容,内包了一个COM组件,外面这个COM组件创建一个隐含窗口,接收内包的COM传送的消息,然后将参数记载到一个变量中保存,再通过一个接口函数查询得到这个变量。rn外包的这个COM里面创建了一个事件(event1),在在变量更新的时候将这个事件set一下(实际使用的是plus)。rn rn在DLL中创建一个辅助线程,里面openevent1,然后等待这个事件,等到事件之后通过接口函数查询得到COM中的变量值。rn在DLL的主线程里面创建一个事件(event2),在辅助线程退出的时候setevent2使主线程继续,然后waitforsingleobject(event2),也就是要在这个函数里面等待辅助线程结束。rn rn这样做从理论上来讲是没有问题的,但是实际上这样做之后,wait(event1)会超时。rn如果不使用event2,而用类似messagebox的方式使主线程挂起,则wait(event1)就没有问题,可以等到。rn rn需要说明的是这个dll被Java的Applet调用,dll调用COM组件的函数。rn rnrn上面所叙述的是一种解决办法中遇到的问题,如果能说在DLL中可以直接进行消息循环,接收COM发送的消息,那么就不再需要外包的那个COM了,相应的麻烦事也就没了。rn rn你觉得问题可能会处在什么地方呢?有没有解决办法?rn rn 论坛

ComboBox组件事件函数是不是有问题?

06-25

目的是在下拉框弹出时在里面画东东,具体情况是这样的,一个ComboBox,名字是cb,style=csOwnerDrawFixed,添加事件OnDrawItem如下rnvoid __fastcall TForm1::cbDrawItem(TWinControl *Control, int Index,rn TRect &Rect, TOwnerDrawState State)rnrn DrawText(cb->Canvas->Handle,"asdf",4,&Rect,DT_LEFT);rnrn函数格式是BCB6自动生成的,程序运行效果也正确。rn但如果我不用系统自动生成的函数,而是自己写一个函数aaa,函数格式是抄过来的,如下rnvoid __fastcall TForm1::aaa(TWinControl *Control, int Index,rn TRect &Rect, TOwnerDrawState State)rnrn DrawText(cb->Canvas->Handle,"asdf",4,&Rect,DT_LEFT);rnrn在.h中添加声明,再在FormCreate中写上cb->OnDrawItem=aaa;结果编译时提示rn[C++ Error] Unit1.cpp(33): E2034 Cannot convert 'void (_fastcall * (_closure )(TWinControl *,int,TRect &,TOwnerDrawState))(TWinControl *,int,TRect &,TOwnerDrawState)' to 'void (_fastcall * (_closure )(TWinControl *,int,const TRect &,TOwnerDrawState))(TWinControl *,int,const TRect &,TOwnerDrawState)'rn就是说在TRect前应该加上const,为什么抄过来会不对,加上const后系统又提示rn[C++ Error] Unit1.cpp(28): E2034 Cannot convert 'const TRect *' to 'tagRECT *'rn[C++ Error] Unit1.cpp(28): E2342 Type mismatch in parameter 'lpRect' (wanted 'tagRECT *', got 'const TRect *')rn又有变量类型错了,由于我的ComboBox是程序运行时动态产生的,所以不能象第一种办法那样让系统替我添加事件函数,只能象第二种方法那样自己添加,该怎么办?rnrn这种添加事件函数的办法在delphi下尝试过,没有任何问题,无需const之类的参数,函数格式直接写rnprocedure TForm1.aaa(Control:TWinControl; Index:Integer; Rect:TRect; State:TOwnerDrawState);就可以了。 论坛

JTabbedPane中使用组件,

12-10

程序刚打开的时候,应显示第一个panel中的Label"这是第一页",却显示出了第二个panel中的"这是第二页", 这是为什么?rn将第二个panel设为不可见,依旧如此,为何?rn请教高手rnrnimport java.awt.*;rnimport java.awt.event.*;rnimport javax.swing.*; rnimport javax.swing.event.*;rnrnpublic class Noname2rnrnpublic static void main(String args[])rn rnnew MyTabbedPane();rnrnrnclass MyTabbedPane extends Frame implements ChangeListenerrnrnJTabbedPane jtp;rnint currentIndex=0;rnint systemtype=1;rnrn/////////////////////////////////////////////////////////////////////////////rnJPanel[] pn;//= new JPanel(new GridLayout(10, 1));//定义面板rnrn///////////////////////界面一////////////////////////////////////////////////rnrnLabel systemLabel=new Label("这是第一页");rn/////////////////////end of 界面一/////////////////////////////////////////////rn///////////////////////界面二//////////////////////////////////////////////////rnrnLabel meansLabel=new Label("这是第二页");rn/////////////////////end of 界面二////////////////////////////////////////////rnrnMyTabbedPane()rnrnsuper("使用卡片容器");rnjtp=new JTabbedPane();rnpn=new JPanel[9];rn//初始化rnrnfor(int i=0;i<9;i++)rnrnrnpn[i]=new JPanel(new GridLayout(10, 1));////初始化,加入布局;rnpn[i].setBackground(Color.lightGray);rnjtp.addTab("第"+(++i)+"步",pn[--i]);rnrnrnrnjtp.addChangeListener(this);rnadd(jtp,BorderLayout.CENTER);rnaddWindowListener(new WindAdpt());rnsetSize(640,480);rnrninterface1();rninterface2();rnrnshow();rnrn//end of MyTabbedPane()rnrnpublic void stateChanged(ChangeEvent e)rnrnif(e.getSource()==jtp)rnrnint i=((JTabbedPane)e.getSource()).getSelectedIndex();rnpn[currentIndex].setVisible(false);rnpn[i].setVisible(true);rncurrentIndex=i;rnrnrn//end of public void stateChanged(ChangeEvent e)rnrn/////////////////////////////初始化 界面一///////////////////////////////////rnpublic void interface1()rnrnpn[0].add(systemLabel);rnpn[0].setVisible(true);rnrn//end of interface1()rn/////////////////////////////end of 界面一///////////////////////////////////////rnrn/////////////////////////////初始化 界面二///////////////////////////////////rnpublic void interface2()rnrnpn[1].add(meansLabel);rnpn[1].setVisible(false);rnrn//end of interface2rnrn/////////////////////////////end of 界面二///////////////////////////////////////rnrn//end of classrnrnclass WindAdpt extends WindowAdapterrnrnpublic void windowClosing(WindowEvent e)rnrn(e.getWindow()).dispose();rnSystem.exit(0);rnrn rn 论坛

没有更多推荐了,返回首页