Preguntas etiquetadas con reactjs

Estoy rompiendo todo el ejemplo de Redux para tratar de entenderlo. Leí que mapDispatchToPropste permite mapear acciones de despacho como accesorios, así que pensé en reescribir addTodo.jspara usar mapDispatchToProps en lugar de llamar a dispatch (addTodo ()). Lo llamé addingTodo(). Algo como esto: import React from 'react'; import {connect} from …

92 javascript  reactjs  redux  react-redux 

¿Qué causa el siguiente problema? ¿Mi versión del SDK de Android no es compatible? 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 …

92 javascript  android  reactjs  react-native 

Quiero incluir / omitir dinámicamente el atributo deshabilitado en un elemento de botón. He visto muchos ejemplos de valores de atributos dinámicos, pero no de atributos en sí mismos. Tengo la siguiente función de renderizado: render: function() { var maybeDisabled = AppStore.cartIsEmpty() ? "disabled" : ""; return <button {maybeDisabled}>Clear cart</button> …

92 reactjs 

Por lo que sé y corregirme si me equivoco, redux-thunk es un middleware que nos ayuda a distribuir funciones asíncronas y depurar valores en la acción misma, mientras que cuando usé redux-promise no podía crear funciones asíncronas sin implementar la mía propia mecanismo como Action lanza una excepción de despachar …

92 reactjs  redux  redux-thunk  redux-promise 

En mi componente de reacción, estoy tratando de implementar un spinner simple mientras una solicitud ajax está en progreso; estoy usando el estado para almacenar el estado de carga. Por alguna razón, este fragmento de código a continuación en mi componente React arroja este error Solo se puede actualizar un …

92 javascript  ajax  reactjs  state 

Quiero usar un evento keyDown en un div en React. Hago: componentWillMount() { document.addEventListener("keydown", this.onKeyPressed.bind(this)); } componentWillUnmount() { document.removeEventListener("keydown", this.onKeyPressed.bind(this)); } onKeyPressed(e) { console.log(e.keyCode); } render() { let player = this.props.boards.dungeons[this.props.boards.currentBoard].player; return ( <div className="player" style={{ position: "absolute" }} onKeyDown={this.onKeyPressed} // not working > <div className="light-circle"> <div className="image-wrapper"> <img src={IMG_URL+player.img} …

92 reactjs  events  keypress  keydown 

Tengo un elemento de casilla de verificación TSX (JSX): <input type="checkbox" name={i.toString()} onClick={this.handleCheckboxClick} /> Con la ayuda del código VS, sé que el tipo de parámetro de entrada de this.handleCheckboxClickis MouseEvent<HTMLInputElement>. Entonces lo implementé con: private handleCheckboxClick(event: MouseEvent<HTMLInputElement>) { ... } Luego [ts] Type 'MouseEvent' is not generic.aparece un error …

92 reactjs  typescript  events  types  jsx 

Estoy usando ReactJS y parte de mi aplicación requiere JSON bastante impreso. Obtengo algo de JSON como:, { "foo": 1, "bar": 2 }y si lo ejecuto JSON.stringify(obj, null, 4)en la consola del navegador, se imprime bastante, pero cuando lo uso en este fragmento de reacción: render: function() { var json …

92 javascript  json  reactjs  flux 

Usando el método css-in-js para agregar clases a un componente de reacción, ¿cómo agrego varios componentes? Aquí está la variable de clases: const styles = theme => ({ container: { display: 'flex', flexWrap: 'wrap' }, spacious: { padding: 10 }, }); Así es como lo usé: return ( <div className={ …

92 css  reactjs  material-design  material-ui  jss 

Solo puedo ver la aplicación real debajo /public. Las configuraciones en webpack.config.jsestán a continuación: 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', …

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

Por ejemplo: codepen var InputBox = React.createClass({ render: function() { return ( <input className="mainInput" value='Some something'></input> ) } });

92 javascript  select  input  reactjs 

El primer principio de la documentación de Redux es: El estado de toda su aplicación se almacena en un árbol de objetos dentro de una sola tienda. Y de hecho pensé que comprendo bien todos los principios. Pero ahora estoy confundido sobre qué significa la aplicación. Si la aplicación significa …

92 reactjs  redux  flux 

Los documentos de Redux para bindActionCreators establecen que: El único caso de uso bindActionCreatorses cuando desea pasar algunos creadores de acciones a un componente que no conoce Redux, y no desea pasarle el envío o la tienda de Redux. ¿Cuál sería un ejemplo donde bindActionCreatorsse usaría / necesitaría? ¿Qué tipo …

91 reactjs  redux  react-redux 

Miré la documentación de Facebook en ( React.Component ) y menciona cómo componentWillMountse invoca en el cliente / servidor, mientras que componentDidMountse invoca solo en el cliente. ¿Qué le hace componentWillMountal servidor?

91 reactjs 

Estoy usando Sublime Text como editor de texto. Hay un jsFormat para formatear archivos javascript pero no puedo encontrar uno para JSX. ¿Cómo lidian con el formateo de JSX?

91 reactjs  sublimetext  react-jsx