在config.js里 添加路由

{
             // name: 'applications',
             // icon: 'smile',
              path: '/blog/show',
              component: './blog/ShowSingleArticle',
            },

在路由query的参数存在props.location.query 结构里

const EditArticle: FC<Record<string, any>> = (props) => {
 
  const [content, setContent] = useState("") //
  const params = props.location

 
  const getContent = useCallback(async () =>{
    const articleInfo = await GetContent({ id: params.query.id})
    const contentI = articleInfo.content
    console.log("params", params.query.id)
    setContent(contentI || "")
  },[params.query.id])

  // 及时销毁 editor ,重要!
  useEffect(() => {
    return () => {
      if (editor == null) return
      editor.destroy()
      setEditor(null)
    }
  }, [editor])

  useEffect(() => { 
    
    getContent()
  }, [getContent])

  return (
   
      <PageContainer content="博客">
       
        <Card><div
          dangerouslySetInnerHTML={{
            __html: content
          }} /></Card>

      </PageContainer>
  );
};

export default EditArticle;

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐