5
votos
Aceito
React Route sem link
Primeiro você deve importar o login no Main.js
Main.js
import Login from "./Login";
Depois ainda dentro do seu Main.js você deve adicionar a rota
<div className="content">
// Rota login ...
5
votos
Aceito
Como redirecionar para uma rota usando onClick e React Router
Como o padrão mais usado no ReactJS é criar Single Page Applications, você vai precisar utilizar uma biblioteca que crie as rotas do lado do client(browser), pois não existe um servidor ditando as ...
4
votos
Aceito
Por que a minha rota no React fica com /#/?
Porque você está utilizando o HashRouter, que utiliza location.hash para determinar a página que o usuário verá. Essa parte da URL chama-se hash.
Você pode utilizar o BrowserRouter para ter um path &...
3
votos
Aceito
Como pegar o parametro da url no NextJs
Para que você tenha esse formato de URL http://localhost:3000/listid/10 basta criar dentro do diretório pages seguindo esse formato: listid/[id].js onde listid seria uma pasta com a página [id].js ...
3
votos
Aceito
React-router <Redirect> não funciona
O problema é que você está utilizando return no ComponentDidMount com a intenção de renderizar um elemento. Isso não acontece.
Para renderizar o elemento, ele deve ser retornado dentro do render. Uma ...
2
votos
Aceito
Como manter o setState usando o Router no React?
O seu bug está sendo causado pelo uso da TAG <a href="/" onClick={this.props.handleSave}>Salvar</a>. Utilizando essa tag você força que seja atualizado a página montando todos os seus ...
2
votos
Como redirecionar para uma rota usando onClick e React Router
Troca o BrowserRouter pelo Router, usa um history manual, só fazer isso:
import { createBrowserHistory } from "history"
const history = createBrowserHistory({
basename: "/"
})
window.redirect = ...
2
votos
Aceito
Pegar ID em crud com javascript
Você pode passar o id dentro da função, como um parâmetro. Veja bem no evento de click, passei o id como parâmetro e na sua função handleDel, eu coloquei recebendo o _id como parâmetro.
import api ...
2
votos
React Switch Route Default
Você pode usar o componente Redirect.
Fica algo assim:
<Switch>
<Route exact path='/dashboard' component={Dashboard} default />
<Route exact path='/profile' component={Profile} />...
2
votos
Aceito
Menu Lateral não é exibido no app feito em React-Native
De acordo com o seu comentário, o menu aparece se você adicionar um botão em alguma tela.
Para fazer o menu aparecer ao desligar, será necessário editar o arquivo MainActivity.java, dentro do seu ...
2
votos
Refresh de Token JWT
Olá sugiro fazer uma PrivateRoute, assim a cada rota chamada no routes passaria por essa PrivateRoute e la dentro tu chamaria um metodo para renovar o token.
import { Route, Redirect } from "react-...
2
votos
Aceito
Erro em construtor da classe em React
A diferença é que uma é JavaScript válido em ES5 e outro é código ES6. Ou seja, no inicio quando o React foi lançado usava-se muito código compativel com ES5 (ECMAScript 5) e que não precisava ser ...
1
voto
Como persistir em uma rota, usando react router com Reactjs?
Essa função RouteWrapper possivelmente ta dando conflito. Você mesmo colocou nela que caso o usuário !signed && isPrivate ele seja redirecionado para a pasta raiz. Tente comentar essa parte e ...
1
voto
Como estruturar pastas e arquivos React Js?
Nesse caso acredito que você deveria estudar design patterns, já que entender isso é exatamente o que sua dúvida busca.
Recomendo você dá uma olhada no modelo Fractal - Uma estrutura de aplicativos ...
1
voto
Aceito
Como estruturar pastas e arquivos React Js?
Particularmente eu gosto de utilizar a estrutura abaixo.
Separo components (componentes realmente reutilizáveis em qualquer ponto da aplicação), pages (as páginas), services (qualquer acesso externo), ...
1
voto
Como estruturar pastas e arquivos React Js?
O React Js é a base de componentes, certo?
Sim, segundo o próprio site: Baseado em componentes - Crie componentes encapsulados que gerenciam seu próprio estado e então, combine-os para criar UIs ...
1
voto
Aceito
Não está retornando o HTML no React
Verifica o \ na sua chamada no Routes.js.
<Route path="/dashboards" component={Dashboards} />
E no seu Routes.js as importações não precisam apontar para o index.js, somente para a ...
1
voto
Aceito
Atualizar useEffect da página navigation.goBack?
O evento deve ser criado sim com useEffect mas, o evento é do componente de navegação instalado no projeto @react-navigation/native: 5.1.5, seguindo o código de exemplo contido na documentação:
...
1
voto
Aceito
[[PromisseValue]] React
api.get(`/role/listar/${role}`)
.then(results => {
console.log(result)
})
ou dependendo da versão do node
export const isAdmin = async () => {
var result = await api.get(`/role/...
1
voto
Aceito
Reactjs props para outros component sem redux
Você esta usando a biblioteca 'react-router-dom' essa biblioteca já disponibiliza uma função que faz isso tudo que você esta querendo, é a função <Link to={path_da_rota}>Link</Link> segue ...
1
voto
Aceito
Rotas privadas com reactjs?
Eu tenho o código dessa forma, percebi que no seu tem um parenteses no lugar das chaves, pode ser isso, só estou supondo, mas, logo abaixo tem o código que utilizo e que funciona perfeitamente, onde ...
1
voto
Aceito
Route Flux do React-Native não funciona
Aparentemente o <Router> não aceita vários componentes <Scene> de uma só vez, tenta envolver esses componentes no componente <Stack>, não esquece de importar ele.
<Router>
...
1
voto
Aceito
Redirecionamento após post em api com axios em ReactJS
Se você estiver usando react-router-dom você pode usar this.props.history.push('/your-path'). /your-path é o caminho que você definiu nas suas rotas que renderiza o componente de dashboard.
1
voto
Aceito
Rotas no ReactJS
ok...
tem algumas coisas estranhas no codigo.
O Routes.jsnão esta sendo usado. Pelo menos não nesses arquivos que você mostrou.
Dentro desse arquivo você está usando o componente App nesse trecho &...
1
voto
Rotas Privada ReactJS e React Router
Eu utilizo dessa forma nas minhas aplica
const PrivateRoute = ({component: Component, ...rest}) => {
return (
<Route {...rest} render={props => (
isAuth() ?
<...
1
voto
Url query Reach Route - React
No caso, para pegar os queryParams, você pode acessar this.props.location.search.
Virá no formato ?produto=batata, aí só formatar. Inclusive, pode usar outras libs pra fazer a conversão pa
1
voto
Aceito
Redirecionamento para tela "Home" após validar login - React Native + Firebase
Tenta isso, como dá pra ver ele fica observando se algum usuário autenticou, e entao redireciona. Era essa sua dúvida?
componentDidMount() {
firebase.auth().onAuthStateChanged(user => {
if (user ...
1
voto
Como navegar com o react-router-dom quando ocorrer uma action
A navegação deve ser feita na própria action - o reducer apenas altera o estado da aplicação.
export const logar = ({
email,
senha
}) => {
this.db.login(email, senha).then(res => {
...
1
voto
React Router: Usar mais arquivos com rotas
O problema é como as rotas aninhadas estão organizadas. Você pode fazer o que vc quer da seguinte forma
import React from 'react';
import { Switch, Route } from 'react-router-dom';
import Estoque ...
1
voto
Warning: validateDOMNesting(...): <a> cannot appear as a descendant of <a>
Tive um problema parecido com este utilizando o Material-UI 1.0-beta. O problema que você está tendo é pelo fato de você estar renderizando uma tag do tipo link (<a>) uma dentro da outra, o que ...
Only top scored, non community-wiki answers of a minimum length are eligible
Tags relacionadas
react-router × 71react × 65
javascript × 29
react-native × 11
react-navigation × 9
react-router-dom × 7
react-dom × 6
react-hooks × 5
node.js × 4
api × 2
firebase × 2
route × 2
next.js × 2
html × 1
mysql × 1
android × 1
banco-de-dados × 1
laravel × 1
typescript × 1
aplicação-web × 1
sqlite × 1
mongodb × 1
front-end × 1
post × 1
url × 1