Acabo de comenzar a usar create-react-app con mecanografiado create-react-app my-app --scripts-version=react-scripts-ts y la configuración tslint.json predeterminada no permite console.log (). ¿Cómo puedo (por ahora) habilitar console.log? Los documentos para esto se encuentran en...
Una sola línea funciona bien render: function () { return ( {[1,2,3].map(function (n) { return <p>{n}</p> }} ); } no para varias líneas render: function () { return ( {[1,2,3].map(function (n) { return ( <h3>Item {n}</h3> <p>Description {n}</p> )...
Estoy trabajando en una aplicación de reacción usando react-router. Tengo una página de proyecto que tiene una URL de la siguiente manera: myapplication.com/project/unique-project-id Cuando se carga el componente del proyecto, activo una solicitud de datos para ese proyecto desde el evento...
Tengo un componente que he creado: class Create extends Component { constructor(props) { super(props); } render() { var playlistDOM = this.renderPlaylists(this.props.playlists); return ( <div> {playlistDOM} </div> ) } activatePlaylist(playlistId) { debugger; }...
Teniendo este código en mente: var Component = React.createClass({ getInitialState: function () { return {position: 0}; }, componentDidMount: function () { setTimeout(this.setState({position: 1}), 3000); }, render: function () { return ( <div className="component">...
Así que aquí está mi flujo de trabajo actual para importar imágenes e íconos en el paquete web a través de ES6: import cat from './images/cat1.jpg' import cat2 from './images/cat2.svg' import doggy from './images/doggy.png' import turtle from './images/turtle.png' <img src={doggy}...
¿Cuál es la forma correcta de actualizar el estado, es un objeto anidado, en React with Hooks? export Example = () => { const [exampleState, setExampleState] = useState( {masterField: { fieldOne: "a", fieldTwo: { fieldTwoOne: "b" fieldTwoTwo: "c" } } }) ¿Cómo se usaría...
Acabo de comenzar con Reactjs y estaba escribiendo un componente simple para mostrar la lietiqueta y encontré este error: Token inesperado '<' He puesto el ejemplo en jsbin a continuación http://jsbin.com/UWOquRA/1/edit?html,js,console,output Por favor, avíseme qué estoy haciendo...
Tengo una navegación lateral con un montón de equipos de baloncesto. Así que me gustaría mostrar algo diferente para cada equipo cuando se pasa el cursor sobre uno de ellos. Además, estoy usando Reactjs, así que si pudiera tener una variable que pudiera pasar a otro componente, sería...
Estoy tratando de importar componentes de react-materialize como - import {Navbar, NavItem} from 'react-materialize'; Pero cuando el paquete web está compilando .tsx, arroja un error para lo anterior como: ERROR in ./src/common/navbar.tsx (3,31): error TS7016: Could not find a declaration...
¿Hay formas de simular componentDidMounten React componentes funcionales a través de ganchos?
Tengo lo siguiente: <Route name="app" path="/" handler={App}> <Route name="dashboards" path="dashboards" handler={Dashboard}> <Route name="exploreDashboard" path="exploreDashboard" handler={ExploreDashboard} /> <Route name="searchDashboard" path="searchDashboard"...
Tengo algunos datos llamados estaciones, que es una matriz que contiene objetos. stations : [ {call:'station one',frequency:'000'}, {call:'station two',frequency:'001'} ] Me gustaría representar un componente de interfaz de usuario para cada posición de la matriz. Hasta ahora puedo escribir...
Estoy tratando de pasar un nombre de clase a un componente de reacción para cambiar su estilo y parece que no puedo funcionar: class Pill extends React.Component { render() { return ( <button className="pill {this.props.styleName}">{this.props.children}</button> );...
Estoy creando un formulario en React Native y me gustaría hacer que mi TextInputs 80% del ancho de la pantalla. Con HTML y CSS normal, esto sería sencillo: input { display: block; width: 80%; margin: auto; } Excepto que React Native no admite la displaypropiedad, los anchos de porcentaje...
Tengo la configuración de idioma en el contexto como se muestra a continuación class LanguageProvider extends Component { static childContextTypes = { langConfig: PropTypes.object, }; getChildContext() { return { langConfig: 'en' }; } render() { return this.props.children;...
Quiero hacer un componente React que se pueda arrastrar (es decir, reposicionable con el mouse), que parece involucrar necesariamente el estado global y los controladores de eventos dispersos. Puedo hacerlo de la manera sucia, con una variable global en mi archivo JS, y probablemente podría...
Solo estoy escribiendo en la entrada de texto y, en onChangecaso de que llame setState, React vuelve a reproducir mi interfaz de usuario. El problema es que la entrada de texto siempre pierde el enfoque, por lo que necesito enfocarlo nuevamente para cada letra: D. var EditorContainer =...
Digamos que tengo una lista de objetos simples en mi this.state.listque luego puedo usar para representar una lista de niños. Entonces, ¿cuál es la forma correcta de insertar un objeto this.state.list? A continuación se muestra la única forma en que creo que funcionará porque no puede mutar...
Al enviar un formulario, lo intento en doSomething()lugar del comportamiento de publicación predeterminado. Aparentemente, en React, onSubmit es un evento compatible con formularios. Sin embargo, cuando pruebo el siguiente código: var OnSubmitTest = React.createClass({ render: function() {...