Perguntas com a marcação «reactjs»

Qual é a função $ watch do angular equivalente no React.js? Quero ouvir alterações de estado e chamar uma função como getSearchResults (). componentDidMount: function() { this.getSearchResults(); }

143 javascript  reactjs 

Parece que componentWillReceivePropsserá completamente eliminado nas próximas versões, em favor de um novo método de ciclo de vida getDerivedStateFromProps: static getDerivedStateFromProps () . Após a inspeção, parece que agora você não consegue fazer uma comparação direta entre this.propse nextProps, como pode componentWillReceiveProps. Existe alguma maneira de contornar isso? Além disso, …

142 javascript  reactjs  lifecycle 

Código completo aqui: https://gist.github.com/js08/0ec3d70dfda76d7e9fb4 Oi, Eu tenho um aplicativo onde ele mostra modelos diferentes para desktop e dispositivos móveis com base no ambiente de construção. Sou capaz de desenvolvê-lo onde preciso ocultar o menu de navegação do meu modelo para celular. agora eu sou capaz de escrever um caso de …

142 reactjs  mocha  redux 

Na minha reagir e aplicativo original datilografado, eu uso: onChange={(e) => data.motto = (e.target as any).value}. Como defino corretamente as digitações para a classe, para que eu não precise me intrometer no sistema de tipos any? export interface InputProps extends React.HTMLProps<Input> { ... } export class Input extends React.Component<InputProps, {}> …

142 reactjs  typescript  types  typescript-typings 

Curioso, qual é a maneira correta de abordar isso: var Hello = React.createClass({ getInitialState: function() { return {total: 0, input1:0, input2:0}; }, render: function() { return ( <div>{this.state.total}<br/> <input type="text" value={this.state.input1} onChange={this.handleChange} /> <input type="text" value={this.state.input2} onChange={this.handleChange} /> </div> ); }, handleChange: function(e){ this.setState({ ??? : e.target.value}); t = this.state.input1 …

141 javascript  reactjs  jsx 

Estou usando o webpack para gerenciar um projeto reactjs . Quero carregar imagens em javascript por webpack file-loader. Abaixo está o webpack.config.js : const webpack = require('webpack'); const path = require('path'); const NpmInstallPlugin = require('npm-install-webpack-plugin'); const PATHS = { react: path.join(__dirname, 'node_modules/react/dist/react.min.js'), app: path.join(__dirname, 'src'), build: path.join(__dirname, './dist') }; module.exports …

141 javascript  reactjs  webpack 

Recentemente, olhei para o framework React do Facebook . Ele usa um conceito chamado "o DOM virtual", que eu realmente não entendi. O que é o DOM virtual? Quais são as vantagens?

140 javascript  reactjs 

Estou dando o primeiro passo no ReactJS e tentando entender a comunicação entre pais e filhos. Como estou criando um formulário, tenho o componente para estilizar campos. E também tenho componente pai que inclui campo e verificá-lo. Exemplo: var LoginField = React.createClass({ render: function() { return ( <MyField icon="user_icon" placeholder="Nickname" …

140 javascript  reactjs 

Eu sei que o React pode executar atualizações de estado de forma assíncrona e em lote para otimização do desempenho. Portanto, você nunca pode confiar no estado a ser atualizado depois de ligar setState. Mas você pode confiar Reagir para atualizar o estado na mesma ordem como setStateé chamado para …

139 javascript  reactjs  state  setstate 

O uso componentDidMount()como uma função assíncrona é uma boa prática no React Native ou devo evitá-lo? Preciso obter algumas informações de AsyncStoragequando o componente é montado, mas a única maneira que sei tornar isso possível é tornar a componentDidMount()função assíncrona. async componentDidMount() { let auth = await this.getAuth(); if (auth) …

139 reactjs  asynchronous  react-native 

Estou usando o Typecript com React. Estou tendo problemas para entender como usar refs para obter tipagem estática e intellisense com relação aos nós de reação referenciados pelos refs. Meu código é o seguinte. import * as React from 'react'; interface AppState { count: number; } interface AppProps { steps: …

139 reactjs  typescript 

Novo no Django e ainda mais novo no ReactJS. Estive pesquisando no AngularJS e ReactJS, mas decidi pelo ReactJS. Parecia que estava superando o AngularJS em termos de popularidade, apesar de o AngularJS ter mais participação de mercado, e o ReactJS é mais rápido na coleta. Com todo esse lixo, …

138 django  reactjs 

Eu tenho um componente funcional muito simples como segue: import * as React from 'react'; export interface AuxProps { children: React.ReactNode } const aux = (props: AuxProps) => props.children; export default aux; E outro componente: import * as React from "react"; export interface LayoutProps { children: React.ReactNode } const layout …

138 reactjs  typescript  jsx  typescript2.0 

Estou usando o react com o react-router. Estou tentando passar a propriedade em um "Link" do react-router var React = require('react'); var Router = require('react-router'); var CreateIdeaView = require('./components/createIdeaView.jsx'); var Link = Router.Link; var Route = Router.Route; var DefaultRoute = Router.DefaultRoute; var RouteHandler = Router.RouteHandler; var App = React.createClass({ render …

137 javascript  reactjs  react-router 

Recentemente, mudei de Angular para ReactJs. Estou usando o jQuery para chamadas de API. Eu tenho uma API que retorna uma lista aleatória de usuários que deve ser impressa em uma lista. Não sei como escrever minhas chamadas de API. Qual é a melhor prática para isso? Eu tentei o …

137 javascript  jquery  reactjs