Perguntas com a marcação «reactjs»

Eu posso atingir esse endpoint http://catfacts-api.appspot.com/api/facts?number=99via Postman e ele retornaJSON Além disso, estou usando create-react-app e gostaria de evitar a configuração de qualquer servidor. No código do meu cliente, estou tentando usar fetcha mesma coisa, mas recebo o erro: Nenhum cabeçalho 'Access-Control-Allow-Origin' está presente no recurso solicitado. A origem ' …

166 javascript  reactjs  cors  create-react-app  fetch-api 

No React 16.2, Fragmentsfoi adicionado suporte aprimorado para . Mais informações podem ser encontradas no post do React aqui. Todos conhecemos o seguinte código: render() { return ( // Extraneous div element :( <div> Some text. <h2>A heading</h2> More text. <h2>Another heading</h2> Even more text. </div> ); } Sim, precisamos …

165 reactjs 

Eu tento escrever um componente React. para tags de cabeçalho html (h1, h2, h3, etc ...), em que a prioridade do cabeçalho muda dinamicamente com base na prioridade que definimos nos adereços. Aqui o que eu tento fazer. <h{this.props.priority}>Hello</h{this.props.priority}> resultado esperado: <h1>Hello</h1> Isto não está a funcionar. Existe algum método …

162 reactjs  jsx 

Alguém pode explicar a diferença entre <Route exact path="/" component={Home} /> e <Route path="/" component={Home} /> Eu não sei o significado de 'exato'

161 reactjs  react-router  react-router-dom 

Eu tenho o seguinte estado: this.setState({ selected: { id: 1, name: 'Foobar' } }); Então eu atualizo o estado: this.setState({ selected: { name: 'Barfoo' }}); Como setStateé suposto fundir, eu esperaria que fosse: { selected: { id: 1, name: 'Barfoo' } }; Mas, em vez disso, ele come o id …

160 javascript  reactjs 

react-native run-androidcomando termina deixando uma mensagem no simulador android. A mensagem é a seguinte: Não é possível carregar o script. Verifique se você está executando um servidor Metro ou se seu pacote 'index.android.bundle' está compactado corretamente para a liberação. O que estou fazendo de errado?

160 reactjs  react-native  react-native-android  react-native-cli  metro-bundler 

Como obtenho a altura da janela de exibição no ReactJS? Em JavaScript normal eu uso window.innerHeight() mas usando o ReactJS, não sei como obter essas informações. Meu entendimento é que ReactDOM.findDomNode() funciona apenas para componentes criados. No entanto, esse não é o caso do elemento documentou body, o que pode …

160 javascript  reactjs  window  viewport 

Aqui está o que eu tentei e como dá errado. Isso funciona: <div dangerouslySetInnerHTML={{ __html: "<h1>Hi there!</h1>" }} /> Isto não: <div dangerouslySetInnerHTML={{ __html: this.props.match.description }} /> A propriedade description é apenas uma sequência normal de conteúdo HTML. No entanto, é renderizado como uma sequência, não como HTML por algum …

159 javascript  html  reactjs  jsx 

Estou explorando as possibilidades do React Native ao desenvolver um aplicativo de demonstração com navegação personalizada entre visualizações com a ajuda do Navigatorcomponente . A classe principal do aplicativo renderiza o navegador e o renderSceneretorno interno passa o componente: class App extends React.Component { render() { return ( <Navigator initialRoute={{name: …

158 javascript  ios  navigation  reactjs  react-native 

var MySelect = React.createClass({ change: function(){ return document.querySelector('#lang').value; }, render: function(){ return( <div> <select id="lang"> <option value="select" onChange={this.change}>Select</option> <option value="Java" onChange={this.change}>Java</option> <option value="C++" onChange={this.change}>C++</option> </select> <p></p> <p value={this.change}></p> </div> ); } }); React.render(<MySelect />, document.body); O onChangeevento não funciona.

158 javascript  reactjs 

Eu preciso adicionar uma classe dinâmica a uma lista de classes regulares, mas não tenho idéia de como (estou usando babel), algo como isto: <div className="wrapper searchDiv {this.state.something}"> ... </div> Alguma ideia?

158 css  reactjs 

Eu escrevi um código: function renderGreeting(Elem: React.Component<any, any>) { return <span>Hello, <Elem />!</span>; } Estou recebendo um erro: O tipo de elemento JSX Elemnão possui nenhuma assinatura de construção ou chamada O que isso significa?

157 reactjs  typescript  material-ui 

Existe uma abordagem sistemática para depurar o que está fazendo com que um componente seja renderizado novamente no React? Coloquei um console.log () simples para ver quanto tempo ele renderiza, mas estou tendo problemas para descobrir o que está causando o componente renderizar várias vezes, ou seja, (4 vezes) no …

156 reactjs  redux 

Existe uma maneira de incorporar a notação entre chaves do React e uma hreftag? Digamos que tenhamos o seguinte valor no estado: {this.state.id} e os seguintes atributos HTML em uma tag: href="#demo1" id="demo1" Existe uma maneira de adicionar o idestado ao atributo HTML para obter algo assim: href={"#demo + {this.state.id}"} …

155 javascript  html  reactjs  ecmascript-6 

Eu preciso criar um formulário que exibirá algo com base no valor de retorno de uma API. Estou trabalhando com o seguinte código: class App extends React.Component { constructor(props) { super(props); this.state = {value: ''}; this.handleChange = this.handleChange.bind(this); this.handleSubmit = this.handleSubmit.bind(this); } handleChange(event) { this.setState({value: event.target.value}); } handleSubmit(event) { alert('A …

155 reactjs  typescript