2

左の要素 AppBar のアイコンをクリックすると、_handleClick() メソッドが実行されます。コンソール メッセージを取得できません。私は material-ui フレームワークを使用しており、属性 onLeftIconButtonTouchTap は、タッチ タップで左のアイコンが選択されたときのコールバック関数に提供されます。

import React, { Component } from 'react'
import { AppBar, IconButton } from 'material-ui'
import MoreVertIcon from 'material-ui/lib/svg-icons/navigation/more-vert';

let injectTapEventPlugin = require("react-tap-event-plugin");

//Needed for onTouchTap
//Can go away when react 1.0 release
//Check this repo:
//https://github.com/zilverline/react-tap-event-plugin
injectTapEventPlugin();


class Header extends Component {
  constructor(props) {
    super(props);
    this._handleClick = this._handleClick.bind(this);
  }

  _handleClick(e) {
    e.preventDefault();
    // Show/Hide the LeftMenu
    window.console.log("Click!");
  }

  render() {
       return (
        <AppBar title="Arasaaccc"
                iconElementLeft={ <IconButton>
                                    <MoreVertIcon/>
                                  </IconButton> }
                onLeftIconButtonTouchTap={ this._handleClick }
                isInitiallyOpen={ true } />


      )
  }
}

export default Header

ただし、別のコンポーネントで動作します。

class Prueba extends Component {
  constructor(props) {
    super(props);
    this._handleClick = this._handleClick.bind(this);
  }

  _handleClick(e) {
    e.preventDefault();
    window.console.log("Click!");
  }
  render (){
    return (
      <h1 onClick={this._handleClick}>Prueba Prueba Prueba</h1>
      )
  }
}
export default Prueba;
4

2 に答える 2

8

AppBar コンポーネントのアイコンを指定すると、onLeftIconButtonTouchTap イベントが機能しません。アイコンを指定していないか:

<AppBar title="Arasaaccc" 
         onLeftIconButtonTouchTap={ this._handleClick }
                            isInitiallyOpen={ true } />

または、IconButton コンポーネントにイベントを適用します。

<AppBar title="Arasaaccc"
        iconElementLeft={ <IconButton onTouchTap={ this._handleClick }  >
                            <MoreVertIcon />
                          </IconButton> }
        isInitiallyOpen={ true } />

編集:このGitHubの問題 によれば、問題は解決されるはずです。と_handleClickの両方、どちらか一方にaa を使用することはできません。iconElementLeftonLeftIconButtonTouchTap

于 2015-12-12T20:19:10.510 に答える
0

コードに問題は見られないので、 React-Tap-Event-Pluginが必要になると思います。ドキュメントによると、この依存関係は一時的なものであり、react v1.0 がリリースされるとなくなります。

于 2015-12-11T13:11:58.907 に答える