Material-ui: Bereaksi 15.0.2 "Alat peraga tidak dikenal onTouchTap" peringatan

Saya ingin mengirim PR tetapi saat ini saya tidak tahu cara menguji perubahan dan apakah perubahan itu memperbaiki peringatan?

Menggunakan Yeoman Webpack dan react: ^15.2.1

Warning: Unknown prop `onTouchTap` on <button> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in button (created by EnhancedButton)
    in EnhancedButton (created by RaisedButton)
    in div (created by Paper)
    in Paper (created by RaisedButton)
    in RaisedButton (created by MyButton)
    in div (created by MyButton)
    in MyButton (created by AppComponent)
    in div (created by AppComponent)
    in MuiThemeProvider (created by AppComponent)
    in AppComponent

Dari yang sederhana:

import React from 'react';
import RaisedButton from 'material-ui/RaisedButton';

export default class MyButton extends React.Component {

  render() {
    return (
      <div>
        <RaisedButton>
          Hello, world!
        </RaisedButton>

      </div>
    );
  }
}

Packages.json:

{
  ...
  "devDependencies": {
    ...
    "core-js": "^2.0.0",
    "material-ui": "^0.15.2",
    "normalize.css": "^4.0.0",
    "react": "^15.2.1",
    "react-dom": "^15.0.0",
    "react-tap-event-plugin": "^1.0.0"
  }
}

Diperbaiki dengan menambahkan:

// Needed for onTouchTap
import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();

Ke komponen.

Saya ingin menambahkan: transitionAppearTimeout

warning.js:44 Warning: Unknown prop `transitionAppearTimeout` on <div> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in div (created by ReactTransitionGroup)
    in ReactTransitionGroup (created by DialogInline)
    in div (created by DialogInline)
    in DialogInline
    in MuiThemeProvider

Hanya muncul di Dialog

Pembaruan: Tidak apa-apa, itu dengan react 15.0.0 , dengan 15.2.1 hilang. Saya kira mereka lupa beberapa alat peraga.

Saya memanggil injectTapEventPlugin() di klien dan server dan masih mendapatkan banyak peringatan dengan berbagai elemen.

Versi:

"material-ui": "0.15.2",
"react": "15.2.1",
"react-dom": "15.2.1",
"react-tap-event-plugin": "1.0.0",

Beberapa Peringatan:

Warning: Unknown prop `onTouchTap` on <label> tag. 
Warning: Unknown props `displayBorder`, `columnNumber`, `hoverable`, `onHover`, `onHoverExit` on <td> tag.

@igl coba hubungi injectTapEventPlugin() sebelum ReactDOM.render

@ixrock : memanggil injectTapEventPlugin() sebelum ReactDOM.render tidak memperbaiki masalah (setidaknya tidak untuk saya)

@Ghirigoro masalah yang sama =\

vendors.js:20314 Warning: Unknown prop `onTouchTap` on <button> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in button (created by EnhancedButton)
    in EnhancedButton (created by RaisedButton)
    in div (created by Paper)
    in Paper (created by RaisedButton)
    in RaisedButton
    in MuiThemeProvider

terlepas dari menggunakan/tidak menggunakan injectTapEventPlugin() sebelum/sesudah render. Ada ide, teman-teman?

Menambahkan saran oleh @tavurth dan saya menghilangkan kesalahan.
Saya mencobanya di tempat-tempat berikut dengan sukses:

• Dalam komponen yang menghasilkan kesalahan
• file rute
• file app.js
• file tempat ReactDOM.render dipanggil

Saya memutuskan untuk menempatkannya di file ReactDOM.render

import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();

Melihat kesalahan yang sama pada CardTitle dengan prop titleStyle...

warning.js:44 Warning: Unknown prop `titleStyle` on <div> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in div (created by CardTitle)
    in CardTitle (created by GroupAdmin)
    in div (created by Card)
    in div (created by Paper)
    in Paper (created by Card)
    in Card (created by GroupAdmin)
    in span (created by GroupAdmin)
    in GroupAdmin (created by Operations)

Fragmen kode: <CardTitle title="Group Admin" titleStyle={styles.title}/>

Versi bahan UI: 0.15.2

Terima kasih banyak.

Hai, yang di sana,

Tidak yakin apakah milik saya terkait tetapi saya mendapatkan kesalahan ini saat menggunakan <Chip> .

Unknown prop labelColor on <div> tag.

Hal yang sama untukku :

Peringatan: Penyangga translate tidak diketahui pada tag. Untuk detailnya, lihat https://fb.me/react-unknown-prop

Dan saya menambahkan:

import injectTapEventPlugin from 'react-tap-event-plugin';

injectTapEventPlugin();

Dan itu TIDAK berhasil

Saya memiliki peringatan yang sama. Setelah beberapa debugging saya telah menemukan bahwa itu dibangkitkan dari kode ini:

const MenuLeftItem =
  ({text,url}) =>
    <ListItem
      className="menuleft-module-item"
      primaryText={text}
    />

dan

<AppBar
   title="Admin Panel"
   iconElementLeft={
      <IconButton>
         <NavigationClose />
      </IconButton>
    }
     onClick={onCollapse}
  />

ini paket saya.json

"dependencies": {
    "brace": "^0.8.0",
    "d3": "^4.2.2",
    "deepmerge": "^0.2.10",
    "dom-value": "^1.0.1",
    "form-controls": "^1.0.0",
    "form-parse": "^0.1.0",
    "form-urlencoded": "^1.2.1",
    "formsy-material-ui": "^0.5.0",
    "formsy-react": "^0.18.1",
    "is-submittable": "^1.0.0",
    "isomorphic-fetch": "^2.2.1",
    "js-beautify": "^1.5.10",
    "lodash": "^4.14.1",
    "material-ui": "^0.15.4",
    "muicss": "^0.7.3",
    "query-string": "^4.2.2",
    "radium": "^0.18.1",
    "rd3": "^0.7.1",
    "react": "^15.3.1",
    "react-ace": "^3.1.0",
    "react-diff": "0.0.6",
    "react-dimensions": "^2.0.0-alpha1",
    "react-dom": "^15.3.1",
    "react-edit-inline": "^1.0.6",
    "react-graph-vis": "0.0.3",
    "react-hotkeys": "^0.9.0",
    "react-modal": "^1.4.0",
    "react-notification": "^6.1.0",
    "react-redux": "^4.0.6",
    "react-router": "^2.6.1",
    "react-syntax-highlighter": "^2.0.3",
    "react-tap-event-plugin": "^1.0.0",
    "reactable": "^0.14.0",
    "recompose": "^0.20.0",
    "reduce": "^1.0.1",
    "redux": "^3.0.6",
    "redux-actions": "^0.11.0",
    "redux-localstorage": "^0.4.0",
    "redux-saga": "^0.11.0",
    "redux-thunk": "^2.1.0",
    "reduxerit": "^0.4.1",
    "reselect": "^2.0.3",
    "sha1": "^1.1.1",
    "sleep-promise": "^2.0.0",
    "squares": "^0.2.1",
    "uuid": "^2.0.2",
    "vis": "^4.16.1"
  }
}

menambahkan injectTapEventPlugin() tidak memperbaikinya untuk saya.
saya curiga ini ada hubungannya dengan plugin reaksi HMR

Saya memperbaiki masalah ini dengan beralih dari menggunakan versi UMD dari reaksi ke webpack-ing semuanya. Saya menduga ini memperbaikinya karena beberapa kombo react-tap-event-plugin dan material-ui perlu menjangkau ke internal pribadi React, dan itu tidak dapat melakukan ini dari versi UMD. Mendesah...

Saya memiliki peringatan yang sama untuk Overlay

Warning: Unknown prop `onTouchTap` on <div> tag. Remove this prop from the element. For details, see https://fb.me/react-unknown-prop
    in div (created by Overlay)
    in Overlay (created by DialogInline)
    in div (created by DialogInline)
    in DialogInline

Saya juga sudah membaca di sini https://github.com/facebook/react/issues/436 bahwa react-tap-event-plugin mungkin dapat dihapus sejak reaksi 15. Perlu diselidiki.

Saya menutup masalah ini karena masalah root telah diidentifikasi oleh @tavurth. Terima kasih!

Kami mengandalkan react-tap-event-plugin untuk menambahkan properti onTouchTap .
Sebenarnya, saya senang React menambahkan peringatan ini. Itu akan membantu banyak orang yang melewatkan poin ini dari dokumentasi.

Ke depan, kami berencana untuk menghapus ketergantungan ini di cabang next .
Kami menggunakan acara onClick karena perangkat seluler modern mendukungnya dengan lebih baik (tanpa penundaan).

Saya menggunakan AppBar dan ini adalah kode yang saya gunakan untuk memperbaikinya sesuai komentar di atas:

const Header = React.createClass({
handleClick(e){
console.log("reached here::");
},
render(){
injectTapEventPlugin();
return <AppBar title="Some Heading" onTitleTouchTap={this.handleClick()}/>
}
});

export default Header;

Bagi mereka seperti saya yang menemukan masalah ini, menerapkan perbaikan, dan masalah tetap ada: Pendekatan yang disarankan untuk menjalankan injectTapEventPlugin() hanya berfungsi jika Anda menggunakan WebPack; Saya mengubah aplikasi saya ke webpack dari browserify, tidak membuat perubahan lain pada kode, dan kesalahan hilang.

Adakah yang bisa memberi tahu saya untuk apa injectTapEventPlugin() ada di sini?

@jakewins : Saya mengalami masalah yang sama dengan browserify. Masalahnya adalah saya sedang membangun vendor.js dan satu file js dengan seluruh kode klien saya. Saya menemukan, bahwa react-event-tap-plugin harus dibundel dalam file js tempat lib reaksi Anda berada. Pendekatan ini memperbaiki masalah saya dengan browserify.

Masalah yang sama. @vaspoz

Tampaknya terkait dengan react-tap-event-plugin naik ke ^2.0.0 dan reaksi mengenai 15.4.0. Saya menggunakan build UMD dan memanggil injectTapEventPlugin sebelum ReactDOM.render.

Sayangnya, menggunakan build non UMD bukanlah pilihan.

Adakah yang punya kombinasi versi UMD yang berfungsi dari react + react-tap-event-plugin + material-ui?

@oliviertassinari Apakah cukup stabil untuk menggunakan cabang berikutnya yang memiliki onClick yang lebih asli? Saya tidak peduli jika banyak hal yang rusak, asalkan masih bisa digunakan.

Apakah cukup stabil untuk menggunakan cabang berikutnya yang memiliki onClick yang lebih asli?

@vans163 Ini adalah versi 1 bulan dari cabang next : http://material-ui-next.azurewebsites.net/. Itu tergantung pada apa yang Anda maksud dengan stabil.
API akan berubah jika kita perlu. Hanya beberapa komponen yang telah dimigrasikan, dan seringkali sebagian. Namun, saya memigrasikan aplikasi saya untuk menggunakan 100% cabang ini.

Untuk berjaga-jaga jika itu membantu seseorang hingga rilis baru siap: Saya mengalami masalah ini, tetapi begitu saya memindahkan

import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();

baris ke file komponen tempat saya menerapkan <MuiThemeProvider> dalam hierarki komponen, itu mulai berfungsi. (Ini juga tempat saya melakukan mapStateToProps untuk redux tetapi saya menganggap itu tidak relevan.) Saya sebelumnya telah menerapkannya dalam file untuk komponen yang lebih tinggi yang bertindak sebagai komponen pembungkus saya.

Saya menggunakan paket web yang dikeluarkan dari create-app-react .

@rdnewman Ini berhasil!!

Terima kasih banyak!

terima kasih semua... Saya mendapat peringatan ini dalam pengujian saja, dan kemudian menyadari bahwa injectTapEventPlugin() tidak dipanggil selama pengujian komponen, hanya dalam aplikasi yang penuh

@rdnewman , terima kasih! metode Anda berhasil. Saya meletakkannya di file index.js saya yang berisi file metode ReactDOM.render dan juga bekerja seperti itu. 👍

Saya mendapatkan ini menggunakan create-react-app minggu lalu. React masuk pada 15.4.x dan kesalahan ini terjadi meskipun memanggil injectTapEventPlugin() dengan tepat. Ini dibahas dalam react-tap-event-plugin #85 . Menyimpan/menginstal react-tap-event-plugin secara manual di 2.0.0 menyelesaikan ini untuk saya.

berharap dapat membantu seseorang yang menggunakan TypeScript
Saya menggunakan material-ui dengan TypeScript dan memiliki masalah yang sama.
Setelah menambahkan
import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();
kode sebelum ReactDOM.render itu melempar kesalahan.

TypeError Tidak Tertangkap: react_tap_event_plugin_1.default bukan fungsi

itu diselesaikan dengan mengubah gaya impor
import * as injectTapEventPlugin from 'react-tap-event-plugin';

Terima kasih Tuhan, hari ini saya hanya perlu menginstal react-tap-event-plugin versi 2.0.1 dan react 15.4.2, lalu saya pergi ke file tempat saya membuat aplikasi, dan cukup sertakan dua baris ini:

impor injectTapEventPlugin dari 'react-tap-event-plugin';
injectTapEventPlugin();

Dan itu saja 👍

@erick2014 Yup: http://www.material-ui.com/#/get-started/installation

Masalah yang sangat tidak jelas. Kembali setelah saya melakukan beberapa reorganisasi kode dalam skenario SSR

Untuk "bereaksi": "15.4.2",

Gunakan "react-tap-event-plugin": "^2.0.0" atau react-tap-event-plugin": "^2.0.1"

dan tambahkan ini
// Diperlukan untuk onTouchTap

import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();

Mengimpor dan menambahkan injectTapEventPlugin() memecahkan masalah saya.

import injectTapEventPlugin from 'react-tap-event-plugin;

componentWillMount(){
    injectTapEventPlugin();
    }

Saya menggunakan Next.JS

Solusi ini tidak berfungsi, saya punya file tap_events.js yang diimpor setiap halaman.

File saya tap_events.js:
impor injectTapEventPlugin dari 'react-tap-event-plugin'
if (jendela typeof !== 'undefined') injectTapEventPlugin()