en react js hice un selector de fecha simple y seleccioné la fecha del calendario desplegable y lo mostré en la consola.
esa fecha almacenada en una variable, ahora cómo usar esa variable en la URL
Mis preguntas :
Cómo pasar el parámetro en la URL de React js
cómo imprimir el parámetro en el registro de la consola
código:
import React, { Component } from 'react' import axios from 'axios' class PostForm extends Component { constructor(props) { super(props) this.state = { key: '', } } changeHandler = e => { this.setState({ [e.target.name]: e.target.value }) } submitHandler = e => { e.preventDefault() console.log(this.state) axios .get('http://127.0.0.1:8000/hvals_hash?key=31/8/21') .then(response => { console.log(response) }) .catch(error => { console.log(error) }) } render() { const { key } = this.state return ( <div> <form onSubmit={this.submitHandler}> <div> <input type="text" name="key" value={key} onChange={this.changeHandler} /> </div> <button type="submit">Submit</button> </form> </div> ) } } export default PostFormUna fecha es del formulario del selector de fecha, así que pase la fecha dinámica todo cómo hacerlo
Puede usar literales de plantilla para pasar valores dinámicos de la siguiente manera.
componentDidMount(){ const date = "20/8/21"; axios.get(`http://127.0.0.1:8000/hvals_hash?key=${date}`) .then(response => { this.setState({ posts:response.data }) console.log(response.data) }) } import { BrowserRouter, useParams, Route, Routes, Link, } from 'react-router-dom'; page:send.jsx => <Link to="/get" state={{ from: "test" }}> test </Link> page:get.jsx import { BrowserRouter, useParams, Route, Routes, Link, useNavigate, useLocation, } from "react-router-dom"; const location = useLocation(); const { from } = location.state ? location.state : "null"; console.log(from); send: const { navigate } = useNavigate(); navigate("/get", { state: { from: "test" } }); get: const location = useLocation(); const { from } = location.state; console.log(from);