no message

chenxuan1/src/App.js

@@ -27,7 +27,7 @@ class App extends Component{
               <NavLink to='/todo'>Todo</NavLink>
               <NavLink to='/toast'>Toast</NavLink>
               <NavLink to='/hoc1'>高阶组件1</NavLink>
-              <NavLink to='/button'>Button</NavLink>
+              <NavLink to='/antd'>Ant Design</NavLink>
               {/* <NavLink to='/life'>高阶组件2</NavLink>
               <NavLink to='/life'>高阶组件3</NavLink>
               <NavLink to='/life'>轮播1</NavLink>

chenxuan1/src/pages/antd/index.jsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import {Routes,Route,NavLink} from 'react-router-dom';
+import Button from './buttons';
+import Input from './input';
+import Table from './table';
+import './style.scss';
+class Antd extends React.Component {
+  render() {
+    return (
+      <div className='antd'>
+        <div className='nav'>
+            <NavLink  replace={true} to="/antd/button" children="Button"/>
+            <NavLink replace={true}  to="/antd/input" children="Input"/>
+            <NavLink replace={true}  to="/antd/table" children="Table"/>
+        </div>
+        <div className='content'>
+            <Routes>
+                <Route exact path='/button' element={<Button/>} />
+                <Route exact path='/input' element={<Input/>} />
+                <Route exact path='/table' element={<Table/>} />
+            </Routes>
+        </div>
+      </div>
+    );
+  }
+}
+export default Antd;

chenxuan1/src/pages/antd/input.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+class Input extends React.Component {
+  render() {
+    return (
+      <div>
+        <input type="text" placeholder="请输入内容" />
+      </div>
+    );
+  }
+}
+export default Input;

chenxuan1/src/pages/antd/style.scss

@@ -0,0 +1,3 @@
+.antd{
+    
+}

chenxuan1/src/pages/antd/table.jsx

@@ -0,0 +1,81 @@
+import { Divider, Radio, Table } from 'antd';
+import React, { useState } from 'react';
+const columns = [
+  {
+    title: 'Name',
+    dataIndex: 'name',
+    render: (text) => <a>{text}</a>,
+  },
+  {
+    title: 'Age',
+    dataIndex: 'age',
+  },
+  {
+    title: 'Address',
+    dataIndex: 'address',
+  },
+];
+const data = [
+  {
+    key: '1',
+    name: 'John Brown',
+    age: 32,
+    address: 'New York No. 1 Lake Park',
+  },
+  {
+    key: '2',
+    name: 'Jim Green',
+    age: 42,
+    address: 'London No. 1 Lake Park',
+  },
+  {
+    key: '3',
+    name: 'Joe Black',
+    age: 32,
+    address: 'Sidney No. 1 Lake Park',
+  },
+  {
+    key: '4',
+    name: 'Disabled User',
+    age: 99,
+    address: 'Sidney No. 1 Lake Park',
+  },
+];
+
+const rowSelection = {
+  onChange: (selectedRowKeys, selectedRows) => {
+    console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record.name === 'Disabled User',
+    name: record.name,
+  }),
+};
+const App = () => {
+  const [selectionType, setSelectionType] = useState('checkbox');
+  return (
+    <div>
+      <Radio.Group
+        onChange={({ target: { value } }) => {
+          setSelectionType(value);
+        }}
+        value={selectionType}
+      >
+        <Radio value="checkbox">Checkbox</Radio>
+        <Radio value="radio">radio</Radio>
+      </Radio.Group>
+
+      <Divider />
+
+      <Table
+        rowSelection={{
+          type: selectionType,
+          ...rowSelection,
+        }}
+        columns={columns}
+        dataSource={data}
+      />
+    </div>
+  );
+};
+export default App;

chenxuan1/src/router/index.jsx

@@ -12,7 +12,7 @@ import Hoc1 from "../pages/hoc1"
 import Github from "../pages/github"
 import Todo from "../pages/todo"
 import Toast from "../pages/toast"
-import Button from "../pages/antd/buttons"
+import Antd from "../pages/antd/index"
 const routes = [
     {
       path: "/jsx",
@@ -67,14 +67,14 @@ const routes = [
       component: Toast
     },
     {
-      path: "/button",
-      component: Button
-    },{
       path: "/todo",
       component: Todo
+    },
+    {
+      path: "/antd/*",
+      component: Antd
     }  
    
-   
   ];
 
   export default routes;

demo/route/read.text

@@ -13,7 +13,7 @@
     <Route  path="/home" component={Test1}/>
     此时 to同时匹配 home和test1路由组件  使用Switch标签后只匹配第一个
 
-10、exact属性严格匹配  to匹配path
+10、exact属性严格匹配  to匹配path 按需使用，一般不用开启
     <Route  exact={true} path="/test" component={Test}/>   to='/test/a/b'    此时to不能匹配path
     <Route  exact={false} path="/test" component={Test}/>   to='/test/a/b'    此时可以匹配path
 11、Redict重定向  兜底