React中使用useParams

javascript 复制代码
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import {BrowserRouter,Routes,Route,useParams} from 'react-router-dom';
import Layout from './layout';

const root = ReactDOM.createRoot(document.getElementById('root'));

function User(){
  const params = useParams();
  console.log(params,'params');
  return (
    <div>
      <h1>User</h1>
    </div>
  );  
}


root.render(
  <BrowserRouter>
    <Routes>
      <Route path="/user/:id" element={<User />} />
    </Routes>
  </BrowserRouter>,
  
);
相关推荐
啊阿狸不会拉杆5 小时前
《计算机网络-自顶向下方法》6.7 回顾:Web页面请求的历程 读书笔记
前端·计算机网络
云上工程笔记5 小时前
四柱记账法和复式记账法有什么区别?复式记账为什么更适合查错和对账
大数据·前端·人工智能
恋猫de小郭5 小时前
Dart Skills CLI 1.0 :AI 时代的 Dart 交付支持
android·前端·flutter
Hilaku5 小时前
为什么技术极强的前端,往往当不好前端 Team Leader?
前端·javascript·程序员
Knight_AL5 小时前
EasyExcel 导入模板踩坑:row.add(““)导致文本格式失效与单元格保护问题解决方案
java·前端·easyexcel
Csvn6 小时前
模板字面量类型:用类型做字符串的正则
前端
倾颜6 小时前
AI Chat 长会话性能实践:消息虚拟化、动态高度与流式滚动设计
前端·react.js·node.js
幸运小圣6 小时前
SSE 与 WebSocket 新手入门:前端实时通信完全指南【JavaScript】
前端·javascript·websocket
艾伦野鸽ggg6 小时前
25级开学 JS 考核题解
前端·javascript
meilindehuzi_a6 小时前
LangChain.js + Milvus 向量长期记忆实战:对话写入、语义检索与 RAG 增强
javascript·langchain·milvus