Url trong react và  show html trong react

Url trong react và show html trong react

Việc get thông tin từ url trong react là 1 vấn đề thường xuyên gặp của các lập trình viên .Dưới đây sẽ là cách đọc url_params trong react

Đầu tiên chúng ta cấu hình ở phần router 

<Route path="/post/:id" element={<Post></Post>}></Route>

Tiếp theo phần trỏ link trong return của react

 <Link to={"/post/" + props.post.id}>
          <img src={link} alt={props.post.title} />
          </Link>

Ở trong file post.tsx

import axios from "axios";
import React, { useState } from "react";
import { useParams } from "react-router";
import { Box, Page } from "zmp-ui";

const Post = () => {
  const { id } = useParams();
  const [post, setPost] = useState([]);
  const get_post_urrl = () =>
    axios.get("https://miniapp.xxxx.com/api/getpost/" + id[0].toString());
  if (post.length < 1) {
    const allpost = get_post_urrl().then((res) => {
      setPost(res.data);
    });
  }
  console.log(post);
  return (
    <>
      <Page>
        <Box m={3}>
          <div dangerouslySetInnerHTML={{ __html: post.content }}></div>
        </Box>
      </Page>
    </>
  );
};
export default Post;

Còn phần show  content trong react thì chỉ cần 

          <div dangerouslySetInnerHTML={{ __html: post.content }}></div>

Vậy là xong .React thật đơn giản phải không các bạn