คำถามติดแท็ก reactjs

นี้โครงการของฉัน: https://github.com/kenpeter/my_hak_newsซึ่งเป็นสำเนาโดยตรงของhttps://github.com/grigio/HAgnostic-News Git clone https://github.com/kenpeter/my_hak_newsจากนั้นเรียกใช้react-native run-android รับข้อผิดพลาดนี้: * What went wrong: Execution failed for task ':app:installDebug'. > com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: Failed to finalize session : INSTALL_FAILED_UPDATE_INCOMPATIBLE: Package com.hagnosticnews signatures do not match the previously installed version; ignoring! ปัญหาที่เกี่ยวข้อง: https://github.com/grigio/HAgnostic-News/issues/1ฉันทำตามวิธีต่างๆ แต่ไม่สามารถแก้ไขปัญหานี้ได้

94 android  reactjs  react-native 

ฉันพยายามที่จะทำให้การทำงานของ ReactJS กับรางใช้นี้กวดวิชา ฉันได้รับข้อผิดพลาดนี้: Uncaught ReferenceError: React is not defined แต่ฉันสามารถเข้าถึงวัตถุ React ในคอนโซลของเบราว์เซอร์ได้ ฉันยังเพิ่มpublic / dist / turbo-react.min.jsตามที่อธิบายไว้ที่นี่และเพิ่มบรรทัดใน application.js ตามที่อธิบายไว้ในคำตอบนี้ว่าไม่มีโชค นอกจากนี้ให้ข้อผิดพลาด://= require components var React = require('react') Uncaught ReferenceError: require is not defined ใครช่วยแนะนำวิธีแก้ปัญหานี้ให้ฉันได้ไหม [แก้ไข 1] ซอร์สโค้ดสำหรับอ้างอิง: นี่คือcomments.js.jsxไฟล์ของฉัน: var Comment = React.createClass({ render: function () { return ( <div className="comment"> …

94 javascript  ruby-on-rails  reactjs 

ฉันอาจจะพลาดอะไรบางอย่างที่ชัดเจนและอยากจะเคลียร์ตัวเอง นี่คือความเข้าใจของฉัน ในความไร้เดียงสาตอบสนององค์ประกอบที่เรามีและstates propsการอัปเดตstateด้วยsetStateการแสดงผลองค์ประกอบทั้งหมดอีกครั้ง propsส่วนใหญ่จะอ่านอย่างเดียวและการอัปเดตไม่สมเหตุสมผล ในคอมโพเนนต์การตอบสนองที่สมัครสมาชิกร้านค้าสำรองผ่านบางสิ่งบางอย่างเช่นstore.subscribe(render)เห็นได้ชัดว่าแสดงผลซ้ำทุกครั้งที่มีการอัปเดตร้านค้า react-reduxมีตัวช่วยconnect()ที่ฉีดส่วนหนึ่งของ state tree (ซึ่งเป็นที่สนใจของส่วนประกอบ) และ actionCreators propsสำหรับส่วนประกอบโดยปกติจะผ่านสิ่งต่างๆเช่น const TodoListComponent = connect( mapStateToProps, mapDispatchToProps )(TodoList) แต่ด้วยความเข้าใจว่า a setStateเป็นสิ่งจำเป็นสำหรับการTodoListComponentตอบสนองต่อการเปลี่ยนแปลงโครงสร้างของสถานะ redux (re-render) ฉันไม่พบโค้ดใด ๆstateหรือsetStateที่เกี่ยวข้องในTodoListไฟล์คอมโพเนนต์ มันอ่านประมาณนี้: const TodoList = ({ todos, onTodoClick }) => ( <ul> {todos.map(todo => <Todo key={todo.id} {...todo} onClick={() => onTodoClick(todo.id)} /> )} </ul> ) …

94 reactjs  redux  react-redux 

ฉันต้องการรวม / ละเว้นแอตทริบิวต์ที่ปิดใช้งานในองค์ประกอบปุ่มแบบไดนามิก ฉันได้เห็นตัวอย่างของค่าแอตทริบิวต์ไดนามิกมากมาย แต่ไม่ใช่ของแอตทริบิวต์เอง ฉันมีฟังก์ชันการแสดงผลดังต่อไปนี้: render: function() { var maybeDisabled = AppStore.cartIsEmpty() ? "disabled" : ""; return <button {maybeDisabled}>Clear cart</button> } ซึ่งทำให้เกิดข้อผิดพลาดในการแยกวิเคราะห์เนื่องจากอักขระ "{" ฉันจะรวม / ละเว้นแอตทริบิวต์ที่ปิดใช้งานตามผลลัพธ์ (บูลีน) ของ AppStore.cartIsEmpty () ได้อย่างไร

93 reactjs 

ฉันกำลังพัฒนาแอปใหม่โดยใช้ React Context API ใหม่แทน Redux และก่อนหน้านี้Reduxเมื่อฉันต้องการรับรายชื่อผู้ใช้เช่นฉันเรียกcomponentDidMountสิ่งที่ทำ แต่ตอนนี้ด้วย React Context การกระทำของฉันอยู่ภายใน ผู้บริโภคของฉันซึ่งอยู่ในฟังก์ชันการเรนเดอร์ของฉันซึ่งหมายความว่าทุกครั้งที่เรียกใช้ฟังก์ชันการเรนเดอร์ระบบจะเรียกการดำเนินการของฉันเพื่อรับรายชื่อผู้ใช้ของฉันและนั่นไม่ดีเพราะฉันจะดำเนินการตามคำขอที่ไม่จำเป็นจำนวนมาก ดังนั้นฉันจะเรียกเพียงครั้งเดียวการกระทำของฉันเช่นcomponentDidMountแทนที่จะเรียกในการแสดงผลได้อย่างไร เพื่อเป็นตัวอย่างให้ดูที่รหัสนี้: สมมติว่าฉันกำลังรวมProvidersองค์ประกอบทั้งหมดไว้ในองค์ประกอบเดียวดังนี้: import React from 'react'; import UserProvider from './UserProvider'; import PostProvider from './PostProvider'; export default class Provider extends React.Component { render(){ return( <UserProvider> <PostProvider> {this.props.children} </PostProvider> </UserProvider> ) } } จากนั้นฉันใส่องค์ประกอบผู้ให้บริการนี้ห่อแอปทั้งหมดของฉันดังนี้: import React from 'react'; import …

93 reactjs  react-context 

เมื่อสร้างแอปตอบกลับพนักงานบริการจะถูกเรียกโดยค่าเริ่มต้น เหตุใดจึงใช้พนักงานบริการ สาเหตุของการเรียกค่าเริ่มต้นคืออะไร?

93 javascript  reactjs  service-worker 

ไม่มีพารามิเตอร์ function clickMe(e){ //e is the event } <button onClick={this.clickMe}></button> ด้วยพารามิเตอร์ function clickMe(parameter){ //how to get the "e" ? } <button onClick={() => this.clickMe(someparameter)}></button> ฉันต้องการรับไฟล์event. ฉันจะรับมันได้อย่างไร?

93 javascript  reactjs  events  dom-events 

ฉันกำลังพยายามหาวิธีสลับคลาสที่ใช้งานอยู่onClickเพื่อเปลี่ยนคุณสมบัติ CSS ฉันได้ใช้แนวทางมากมายและอ่านคำตอบ SO มากมาย การใช้ jquery มันค่อนข้างง่ายอย่างไรก็ตามฉันคิดไม่ออกว่าจะทำเช่นนี้ด้วยการตอบสนอง รหัสของฉันอยู่ด้านล่าง ใครช่วยแนะนำว่าฉันควรทำอย่างไร โดยไม่ต้องสร้างส่วนประกอบใหม่สำหรับแต่ละรายการสามารถทำได้หรือไม่? class Test extends Component(){ constructor(props) { super(props); this.addActiveClass= this.addActiveClass.bind(this); } addActiveClass() { //not sure what to do here } render() { <div> <div onClick={this.addActiveClass}> <p>1</p> </div> <div onClick={this.addActiveClass}> <p>2</p> </div> <div onClick={this.addActiveClass}> <p>3</p> </div> </div> } }

93 javascript  reactjs 

เท่าที่ฉันรู้และแก้ไขฉันหากฉันผิดredux-thunkเป็นมิดเดิลแวร์ที่ช่วยให้เราจัดส่งฟังก์ชัน async และค่าดีบักในการดำเนินการเองในขณะที่ฉันใช้สัญญา reduxฉันไม่สามารถสร้างฟังก์ชัน async ได้โดยไม่ต้องใช้งานของฉันเอง กลไกในขณะที่ Action จะยกเว้นการส่งเฉพาะวัตถุธรรมดาเท่านั้น อะไรคือความแตกต่างที่สำคัญระหว่างสองแพ็คเกจนี้? มีประโยชน์อะไรบ้างจากการใช้ทั้งสองแพ็คเกจในแอปตอบกลับหน้าเดียวหรือติดกับ redux-thunk ก็เพียงพอแล้วหรือไม่?

93 reactjs  redux  redux-thunk  redux-promise 

เอกสารReduxสำหรับbindActionCreatorsระบุว่า: กรณีใช้งานเพียงอย่างเดียวbindActionCreatorsคือเมื่อคุณต้องการส่งต่อผู้สร้างการกระทำบางอย่างไปยังส่วนประกอบที่ไม่รู้จัก Redux และคุณไม่ต้องการส่งต่อหรือจัดเก็บ Redux ไปที่มัน จะเป็นตัวอย่างอะไรได้บ้างbindActionCreators/ จำเป็นต้องใช้? ซึ่งชนิดขององค์ประกอบที่จะไม่ทราบRedux ? ข้อดี / ข้อเสียของทั้งสองทางเลือกคืออะไร? //actionCreator import * as actionCreators from './actionCreators' function mapStateToProps(state) { return { posts: state.posts, comments: state.comments } } function mapDispatchToProps(dispatch) { return bindActionCreators(actionCreators, dispatch) } เทียบกับ function mapStateToProps(state) { return { posts: state.posts, comments: state.comments } } …

93 reactjs  redux  react-redux 

/publicฉันเท่านั้นที่สามารถดูแอปที่เกิดขึ้นจริงภายใต้ การกำหนดค่าwebpack.config.jsอยู่ด้านล่าง: var path = require('path'); var webpack = require('webpack'); module.exports = { entry: [ 'webpack-dev-server/client?http://localhost:8080', 'webpack/hot/only-dev-server', './app/js/App.js' ], output: { path: path.join(__dirname, 'public'), filename: 'bundle.js', publicPath: 'http://localhost:8080' }, module: { loaders: [ { test: /\.js$/, loaders: ['react-hot', 'babel-loader'], exclude: /node_modules/ } ] }, plugins: [ new webpack.HotModuleReplacementPlugin(), new webpack.NoErrorsPlugin() …

93 node.js  reactjs  webpack  reactjs-flux  webpack-dev-server 

ฉันกำลังพยายามแปลง<canvas>แอนิเมชั่นสุดเจ๋งที่ฉันพบที่นี่ให้เป็นส่วนประกอบที่สามารถนำกลับมาใช้ใหม่ได้ ดูเหมือนว่าคอมโพเนนต์นี้ต้องการคอมโพเนนต์พาเรนต์หนึ่งสำหรับแคนวาสและคอมโพเนนต์ลูกจำนวนมากสำหรับไฟล์function Ball(). ด้วยเหตุผลด้านประสิทธิภาพอาจเป็นการดีกว่าที่จะทำให้Ballsเป็นส่วนประกอบที่ไร้สัญชาติเนื่องจากจะมีหลายองค์ประกอบ ฉันไม่คุ้นเคยกับการสร้างส่วนประกอบที่ไร้สัญชาติและสงสัยว่าฉันควรกำหนดthis.update()และthis.drawฟังก์ชันที่กำหนดไว้ที่function Ball()ใด ฟังก์ชันสำหรับส่วนประกอบที่ไม่มีสถานะอยู่ภายในส่วนประกอบหรือภายนอก? กล่าวอีกนัยหนึ่งข้อใดต่อไปนี้ดีกว่า 1: const Ball = (props) => { const update = () => { ... } const draw = () => { ... } return ( ... ); } 2: function update() { ... } function draw() { ... } const Ball = …

93 reactjs 

ฉันกำลังทำงานในโครงการ React และพบปัญหาที่ทำให้ฉันนิ่งงัน เมื่อใดก็ตามที่ฉันเรียกใช้yarn startฉันพบข้อผิดพลาดนี้: TypeError [ERR_INVALID_ARG_TYPE]: อาร์กิวเมนต์ "พา ธ " ต้องเป็นสตริงประเภท ได้รับประเภทไม่ได้กำหนด ฉันไม่รู้ว่าทำไมสิ่งนี้ถึงเกิดขึ้นถ้าใครมีประสบการณ์ฉันจะรู้สึกขอบคุณ

92 javascript  reactjs  redux  visual-studio-code  yarnpkg 

สาเหตุของปัญหาต่อไปนี้คืออะไร? ไม่รองรับเวอร์ชัน Android SDK ของฉันหรือไม่ Starting JS server... Building and installing the app on the device (cd android && gradlew.bat installDebug)... FAILURE: Build failed with an exception. * What went wrong: A problem occurred configuring project ':app'. > failed to find Build Tools revision 23.0.1

92 javascript  android  reactjs  react-native 

ในส่วนประกอบการตอบสนองของฉันฉันพยายามใช้สปินเนอร์แบบธรรมดาในขณะที่คำขอ ajax กำลังดำเนินการอยู่ - ฉันใช้สถานะเพื่อเก็บสถานะการโหลด ด้วยเหตุผลบางประการโค้ดด้านล่างในองค์ประกอบการตอบสนองของฉันทำให้เกิดข้อผิดพลาดนี้ อัปเดตได้เฉพาะส่วนประกอบที่ติดตั้งหรือติดตั้งเท่านั้น โดยปกติจะหมายถึงคุณเรียกว่า setState () บนส่วนประกอบที่ไม่ได้ต่อเชื่อม นี่คือ no-op โปรดตรวจสอบรหัสสำหรับส่วนประกอบที่ไม่ได้กำหนด หากฉันกำจัดการเรียก setState แรกข้อผิดพลาดจะหายไป constructor(props) { super(props); this.loadSearches = this.loadSearches.bind(this); this.state = { loading: false } } loadSearches() { this.setState({ loading: true, searches: [] }); console.log('Loading Searches..'); $.ajax({ url: this.props.source + '?projectId=' + this.props.projectId, dataType: 'json', crossDomain: …

92 javascript  ajax  reactjs  state