1
ポータルの一覧表であるポータルリストページを作成しようとしています。表の各行はポータルへのリンクです。今、このクリックでカスタムアクションを取らなければなりません。私のコードは、今の問題は、上記のコンポーネントのメソッドが呼び出されているレンダリングするとき、それはまた、各行のonclickハンドラを呼び出すと評価しているReactRouterリンクのカスタムonClickハンドラの作成中にエラーが発生しました
var React = require('react');
var Link = require('react-router').Link;
var PortalStore = require('../../stores/portal-store');
var PortalLandingPage = React.createClass({
\t getInitialState: function() {
return PortalStore.getPortalList();
},
updateAuthorizationCookie: function (portalIdHash) {
PortalStore.setPortalIdHash(portalIdHash);
PortalStore.generateAuthToken();
this.transitionTo('portalHome', {portalIdHash: portalIdHash});
},
render: function() {
var createPortalRow = function (portal) {
return (
<tr key={portal.portalId}>
<td>
<Link to='portalHome'
params={{
portalIdHash: portal.portalIdHash,
contentId: portal.portalId
}}
onClick={this.updateAuthorizationCookie(portal.portalIdHash)}
>{portal.portalName}</Link>
<b></b>
<hr align="left" width="100%"></hr>
</td>
</tr>
);
};
\t \t return (
\t \t \t <table className="table">
\t \t \t \t <thead>
\t \t \t \t <tr><th>
\t \t \t \t \t Name
\t \t \t \t \t <b></b>
\t \t \t \t \t <hr align="left" width="100%"></hr>
\t \t \t \t </th></tr>
\t \t \t \t </thead>
\t \t \t \t <tbody>
\t \t \t \t {this.state.portalList.map(createPortalRow, this)}
\t \t \t \t </tbody>
\t \t \t </table>
\t \t </div>);
}
}
module.exports = PortalLandingPage;like-見えます。代わりに、私の要件は、ユーザーがリンクをクリックしたときにのみonClickハンドラが呼び出されるということです。私はまた、ハンドラの周りのカッコを削除しようとしましたが、コンパイル時にエラーが発生します。
<Link to='portalHome'
params={{
portalIdHash: portal.portalIdHash,
contentId: portal.portalId
}}
onClick=this.updateAuthorizationCookie(portal.portalIdHash)
>{portal.portalName}</Link>私のコードが間違っているものを提案してください。