15
コンポーネントのスコープ内で再利用できるように、コンポーネントクラス内で関数を作成することはできますか?
コンポーネントのスコープ内で再利用できるように、コンポーネントクラス内で関数を作成することはできますか?
反応コンポーネントで関数を作成できます。実際にはを継承する通常のES6 classです。ただ、注意が必要とonClick
イベントで正しいコンテキストにバインド:
export default class Archive extends React.Component {
saySomething(something) {
console.log(something);
}
handleClick(e) {
this.saySomething("element clicked");
}
componentDidMount() {
this.saySomething("component did mount");
}
render() {
return <button onClick={this.handleClick.bind(this)} value="Click me" />;
}
}
you can try this.
//Author : Hannad Rehman Sat Jun 03 2017 12:59:09 GMT+0530 (India Standard Time)
import React from 'react';
import RippleButton from '../../Components/RippleButton/rippleButton.jsx';
class HtmlComponents extends React.Component {
constructor(props){
super(props);
this.rippleClickFunction=this.rippleClickFunction.bind(this);
}
rippleClickFunction(){
//do stuff.
// foo==bar
}
render() {
return (
<article>
<h1>React Components</h1>
<RippleButton onClick={this.rippleClickFunction}/>
</article>
);
}
}
export default HtmlComponents;
唯一の懸念は、ありがとう...あなたはそう簡単な関数
にコンテキストをバインドする必要があります! – Alexey
あなたは歓迎です:-) – madox2
関数の再帰呼び出しをしたいのですが?どのようにあなたはその機能の中でそれを呼びますか? – Norfeldt