Material-ui: React 15.0.2 تحذيرات "Unknown Props onTouchTap"

أرغب في إرسال PR ولكن في الوقت الحالي لا أعرف كيفية اختبار التغييرات وما إذا كانت هذه التغييرات تعمل على إصلاح التحذير؟

باستخدام Yeoman Webpack و 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

من البسيط:

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"
  }
}

ثابت بإضافة:

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

إلى المكون.

أود أن أضيف: 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

يظهر فقط في Dialog

تحديث: نيفيرمايند ، كان ذلك مع رد فعل 15.0.0 ، مع 15.2.1 ذهب. أعتقد أنهم نسوا بعض الدعائم.

أتصل بـ injectTapEventPlugin() في كل من العميل والخادم وما زلت أتلقى الكثير من التحذيرات بالعناصر المختلفة.

الإصدارات:

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

بعض التحذيرات:

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

igl حاول الاتصال بـ injectTapEventPlugin() قبل ReactDOM.render

ixrock : استدعاء injectTapEventPlugin() قبل ReactDOM.render لا يحل المشكلة (على الأقل ليس لي)

Ghirigoro نفس المشكلة = \

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

بغض النظر عن استخدام / عدم استخدام injectionTapEventPlugin () قبل / بعد التقديم. اي افكار يا شباب؟

تمت إضافة اقتراح tavurth وتخلصت من الخطأ.
لقد جربته في الأماكن التالية بنجاح:

• في المكون الذي يولد الخطأ
• ملف المسارات
• app.js
• الملف حيث يتم استدعاء ReactDOM.render

استقرت على وضعه في ملف ReactDOM.render

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

جارٍ رؤية الخطأ نفسه على CardTitle مع عنوان PropStyle ...

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)

جزء الكود: <CardTitle title="Group Admin" titleStyle={styles.title}/>

إصدار واجهة المستخدم المادية: 0.15.2

شكرا جزيلا.

أهلا،

لست متأكدًا مما إذا كان لي مرتبطًا ولكني تلقيت هذا الخطأ عند استخدام <Chip> .

Unknown prop labelColor on <div> tag.

نفس الشئ لى :

تحذير: خاصية غير معروفة translate على العلامة. للحصول على التفاصيل ، راجع https://fb.me/react-unknown-prop

وأضيف:

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

injectTapEventPlugin();

وهو لا يعمل 👎

لدي نفس التحذير. بعد بعض التصحيح اكتشفت أنه نشأ من هذا الكود:

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

و

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

هذه مجموعتي. 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"
  }
}

إضافة injectTapEventPlugin() لم يصلحها لي.
أظن أن له علاقة مع المكون الإضافي للتفاعل HMR

لقد أصلحت هذه المشكلة بالتبديل من استخدام إصدار UMD للتفاعل مع webpack-ing كل شيء. أظن أن هذا يعمل على إصلاحه لأن بعض المجموعات المكونة من رد فعل-tap-event-plugin و material-ui تحتاج إلى الوصول إلى الأجزاء الداخلية الخاصة لـ React ، ولا يمكنها القيام بذلك من إصدار UMD. تنهد...

لدي نفس التحذير من التراكب

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

لقد قرأت أيضًا هنا https://github.com/facebook/react/issues/436 أنه من المحتمل إزالة المكون الإضافي رد فعل انقر على الحدث منذ رد الفعل 15. تحتاج إلى التحقيق.

أقوم بإغلاق هذه المشكلة حيث تم تحديد مشكلة الجذر بواسطةtavurth. شكرا!

نحن نعتمد على react-tap-event-plugin لإضافة الخاصية onTouchTap .
في الواقع ، أنا سعيد لأن React أضاف هذا التحذير. سيساعد هذا الكثير من الأشخاص الذين فاتتهم هذه النقطة من التوثيق.

من الآن فصاعدًا ، نخطط لإزالة هذه التبعية في الفرع next .
نستخدم حدث onClick حيث تدعمه الأجهزة المحمولة الحديثة بشكل أفضل (بدون تأخير).

كنت أستخدم AppBar وهذا هو الكود الذي أستخدمه لإصلاح هذا وفقًا للتعليقات أعلاه:

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

export default Header;

بالنسبة لأولئك مثلي الذين اكتشفوا هذه المشكلة ، وطبقوا الإصلاحات ، واستمرت المشكلة: الطريقة المقترحة لتشغيل injectTapEventPlugin() لا تعمل إلا إذا كنت تستخدم WebPack ؛ لقد غيرت تطبيقي إلى webpack من المتصفح ، ولم أجري أي تغييرات أخرى على الكود ، واختفى الخطأ.

هل يمكن لأي شخص أن يخبرني ما هو injectionTapEventPlugin () الموجود هنا من فضلك؟

jakewins : واجهت نفس المشكلة مع browserify. كانت المشكلة أنني أقوم بإنشاء ملف vendor.js وملف js واحد بكود العميل بالكامل. اكتشفت أنه يجب تجميع المكون الإضافي رد فعل-حدث-انقر داخل ملف js حيث يوجد ملف رد الفعل الخاص بك. هذا النهج أصلح مشكلتي مع المتصفح.

المشكلة نفسها. تضمين التغريدة

يبدو أنه مرتبط بالمكوِّن الإضافي response-tap-event الذي يصل إلى ^ 2.0.0 ويصل إلى 15.4.0. أنا أستخدم بناء UMD واستدعي injectionTapEventPlugin قبل ReactDOM.render.

استخدام بنية غير UMD للأسف ليس خيارًا.

هل لدى أي شخص مجموعة نسخة UMD عاملة من رد فعل + رد فعل-نقر-حدث-البرنامج المساعد + مادة-واجهة مستخدم؟

oliviertassinari هل سيكون مستقرًا بدرجة كافية لاستخدام الفرع التالي الذي يحتوي على موقع onClick الأصلي؟ لا يهمني إذا تحطمت أشياء كثيرة ، طالما أنها شبه صالحة للاستعمال.

هل سيكون مستقرًا بدرجة كافية لاستخدام الفرع التالي الذي يحتوي على أكثر أصالة onClick؟

@ vans163 هنا نسخة عمرها شهر واحد من الفرع next : http://material-ui-next.azurewebsites.net/. يعتمد ذلك على ما تعنيه بالمستقر.
ستتغير واجهة برمجة التطبيقات إذا احتجنا إلى ذلك. تم ترحيل بعض المكونات فقط ، وغالبًا جزئيًا. ومع ذلك ، فإنني أقوم بترحيل تطبيقي لاستخدام هذا الفرع بنسبة 100٪.

فقط في حالة مساعدة شخص ما حتى يصبح الإصدار الجديد جاهزًا: واجهت هذه المشكلة ، ولكن بمجرد أن نقلت ملف

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

الأسطر إلى ملف المكون حيث أقوم بتطبيق <MuiThemeProvider> في التسلسل الهرمي للمكونات ، بدأ العمل. (إنه أيضًا المكان الذي أفعل فيه mapStateToProps الخاص بي للإعادة ، لكنني أفترض أن هذا غير ذي صلة.) سبق أن قمت بتطبيقها في الملف لمكون أعلى كان بمثابة مكون التفاف خاص بي.

أنا أستخدم حزمة ويب مقذوفة من create-app-react .

@ rdnewman هذا يعمل !!

شكرا جزيلا لك!

شكرًا للجميع ... تلقيت هذا التحذير في الاختبارات فقط ، ثم أدركت أنه لم يتم استدعاء injectTapEventPlugin() أثناء اختبار المكونات ، فقط في التطبيق الكامل

rdnewman ، شكرا لك! طريقتك تعمل. لقد وضعته في ملف index.js الخاص بي حيث احتوى على ملف أسلوب ReactDOM.render وعمل أيضًا بهذه الطريقة. 👍

لقد توصلت إلى هذا باستخدام create-react-app في الأسبوع الماضي. جاء React في 15.4.x وحدث هذا الخطأ بالرغم من استدعاء injectTapEventPlugin() بشكل مناسب. تمت مناقشة هذا في رد فعل-النقر-حدث-البرنامج المساعد رقم 85 . أدى حفظ / تثبيت react-tap-event-plugin عند 2.0.0 يدويًا إلى حل هذا الأمر بالنسبة لي.

نأمل في مساعدة شخص يستخدم الكتابة المطبوعة
أنا أستخدم واجهة المستخدم المادية مع الكتابة المطبوعة ولدي نفس المشكلة.
بعد الإضافة
import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();
كود قبل ReactDOM.render يلقي خطأ.

خطأ في النوع غير معلوم: رد فعل_طاب_فينت_بلوجين_1. الافتراضي ليس دالة

تم حلها عن طريق تغيير أسلوب الاستيراد
import * as injectTapEventPlugin from 'react-tap-event-plugin';

الحمد لله ، في هذه الأيام ، لا بد لي من تثبيت الإصدار 2.0.1 من برنامج رد فعل tap-event-plugin والتفاعل 15.4.2 ، ثم انتقلت إلى الملف حيث أقوم بعرض التطبيق ، وقم بتضمين هذين السطرين فقط:

استيراد insertTapEventPlugin من "رد فعل النقر-حدث-البرنامج المساعد" ؛
injectionTapEventPlugin () ،

وهذا كل شيء 👍

@ erick2014 نعم: http://www.material-ui.com/#/get-started/installation

قضية غامضة بشكل محبط. عدت بعد أن أجريت بعض إعادة تنظيم الكود في سيناريو SSR

بالنسبة إلى "رد فعل": "15.4.2" ،

استخدم "React-tap-event-plugin": "^ 2.0.0" أو response-tap-event-plugin ":" ^ 2.0.1 "

وأضف هذا
// مطلوب لـ onTouchTap

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

أدى استيراد وإضافة injectionTapEventPlugin () إلى حل مشكلتي.

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

componentWillMount(){
    injectTapEventPlugin();
    }

أنا باستخدام Next.JS

هذا الحل لا يعمل ، لدي ملف tap_events.js وهو استيراد كل صفحة.

ملفي tap_events.js:
استيراد insertTapEventPlugin من "رد فعل-نقر-حدث-البرنامج المساعد"
إذا (typeof window! == 'undefined') insertTapEventPlugin ()