Perguntas com a marcação «reactjs»

Tentando fazer com que react-router (v4.0.0) e react-hot-loader (3.0.0-beta.6) funcionem bem, mas obtendo o seguinte erro no console do navegador: Aviso: React.createElement: type é inválido - esperava uma string (para componentes embutidos) ou uma classe / função (para componentes compostos), mas obteve: indefinido. Você provavelmente se esqueceu de exportar seu …

99 reactjs  react-router  react-hot-loader 

Como você pode obter um evento hover ou um evento ativo no ReactJS ao fazer estilização embutida? Descobri que a abordagem onMouseEnter, onMouseLeave tem bugs, então espero que haja outra maneira de fazer isso. Especificamente, se você passar o mouse sobre um componente muito rapidamente, apenas o evento onMouseEnter será …

99 javascript  css  reactjs  mouseevent  dom-events 

Sem Parâmetro function clickMe(e){ //e is the event } <button onClick={this.clickMe}></button> Com Parâmetro function clickMe(parameter){ //how to get the "e" ? } <button onClick={() => this.clickMe(someparameter)}></button> Eu quero pegar o event. Como posso conseguir?

99 javascript  reactjs  events  dom-events 

Então, eu tenho isso: let total = newDealersDeckTotal.reduce(function(a, b) { return a + b; }, 0); console.log(total, 'tittal'); //outputs correct total setTimeout(() => { this.setState({dealersOverallTotal: total}); }, 10); console.log(this.state.dealersOverallTotal, 'dealersOverallTotal1'); //outputs incorrect total newDealersDeckTotal é apenas uma matriz de números, [1, 5, 9]por exemplo this.state.dealersOverallTotal, não fornece o total correto, …

99 javascript  reactjs  state  setstate 

Eu tenho alguns dados chamados de estações que são uma matriz que contém objetos. stations : [ {call:'station one',frequency:'000'}, {call:'station two',frequency:'001'} ] Eu gostaria de renderizar um componente de interface do usuário para cada posição da matriz. Até agora eu posso escrever var stationsArr = [] for (var i = …

98 javascript  reactjs 

Eu tenho o seguinte: <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" handler={SearchDashboard} /> <DefaultRoute handler={DashboardExplain} /> </Route> <DefaultRoute handler={SearchDashboard} /> </Route> Ao usar o DefaultRoute, SearchDashboard é renderizado incorretamente, pois qualquer * Dashboard precisa ser renderizado dentro do Dashboard. Eu gostaria …

98 javascript  routes  reactjs  url-redirection  react-router 

Estou usando o ReactJS e parte do meu aplicativo requer um JSON bem impresso. Eu obtenho alguns JSON como:, { "foo": 1, "bar": 2 }e se eu executar isso JSON.stringify(obj, null, 4)no console do navegador, ele imprime bastante, mas quando eu o uso neste snippet de reação: render: function() { …

98 javascript  json  reactjs  flux 

Eu sei que as extensões do Chrome usam 'manifest.json`, mas aqui, ele é usado como outra coisa também. conteúdo - { "short_name": "React App", "name": "Create React App Sample", "icons": [ { "src": "favicon.ico", "sizes": "192x192", "type": "image/png" } ], "start_url": "./index.html", "display": "standalone", "theme_color": "#000000", "background_color": "#ffffff" } Quando …

98 reactjs  manifest  create-react-app 

Quero importar um arquivo CSS para um componente react. Já tentei, import disabledLink from "../../../public/styles/disabledLink";mas recebo o erro abaixo; Módulo não encontrado: Erro: Não é possível resolver 'arquivo' ou 'diretório' ../../../public/styles/disabledLink em c: \ Users \ User \ Documents \ pizza-app \ client \ src \ components @. /client/src/components/ShoppingCartLink.js 19: …

98 javascript  reactjs  relative-path 

Digamos que eu tenha uma lista de objetos simples na minha this.state.listque posso usar para renderizar uma lista de filhos. Qual é então a maneira certa de inserir o objeto this.state.list? Abaixo está a única maneira que acho que funcionará, porque você não pode alterar o this.statediretamente conforme mencionado no …

97 javascript  reactjs 

No envio de um formulário, estou tentando, em doSomething()vez do comportamento de postagem padrão. Aparentemente, no React, onSubmit é um evento com suporte para formulários. No entanto, quando tento o seguinte código: var OnSubmitTest = React.createClass({ render: function() { doSomething = function(){ alert('it works!'); } return <form onSubmit={doSomething}> <button>Click me</button> …

97 javascript  forms  form-submit  reactjs  onsubmit 

Estou apenas escrevendo para entrada de texto e, onChangecaso eu chame setState, o React processa novamente minha IU. O problema é que a entrada de texto sempre perde o foco, então preciso focalizá-la novamente para cada letra: D. var EditorContainer = React.createClass({ componentDidMount: function () { $(this.getDOMNode()).slimScroll({height: this.props.height, distance: '4px', …

97 javascript  reactjs 

Estou trabalhando em um aplicativo react usando o react-router. Tenho uma página de projeto que tem o seguinte url: myapplication.com/project/unique-project-id Quando o componente do projeto é carregado, aciono uma solicitação de dados para esse projeto a partir do evento componentDidMount. Agora estou tendo um problema em que, se eu alternar …

97 reactjs  react-router 

Estou criando um formulário no React Native e gostaria de fazer TextInput80% da largura da tela. Com HTML e CSS comum, isso seria simples: input { display: block; width: 80%; margin: auto; } Exceto que o React Native não oferece suporte à displaypropriedade, larguras de porcentagem ou margens automáticas. Então, …

97 javascript  css  reactjs  react-native 

Algo tão simples deve ser facilmente realizado, mas estou puxando meu cabelo por causa do quão complicado é. Tudo que eu quero fazer é animar a montagem e desmontagem de um componente React, é isso. Aqui está o que tentei até agora e por que cada solução não funciona: ReactCSSTransitionGroup …

97 animation  reactjs  css-animations  greensock  react-motion