diff --git a/package.json b/package.json
index e7095d9..4ea92a8 100644
--- a/package.json
+++ b/package.json
@@ -1,11 +1,13 @@
{
- "name": "react-app-model",
+ "name": "in-my-heart",
"version": "0.1.0",
"private": true,
"dependencies": {
"cra-template": "1.1.2",
"react": "^17.0.2",
"react-dom": "^17.0.2",
+ "react-dropzone": "^11.3.4",
+ "react-router-dom": "^5.2.0",
"react-scripts": "4.0.3"
},
"scripts": {
diff --git a/src/App.js b/src/App.js
index 3784575..c9c443c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,24 +1,14 @@
-import logo from './logo.svg';
import './App.css';
+import { HashRouter, Route } from 'react-router-dom';
+import { AppContainer } from './index/index';
+import { UploadContainer } from './upload/upload';
function App() {
return (
-
+
+
+
+
);
}
diff --git a/src/index.js b/src/index.js
index ef2edf8..6832e78 100644
--- a/src/index.js
+++ b/src/index.js
@@ -2,7 +2,6 @@ import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
-import reportWebVitals from './reportWebVitals';
ReactDOM.render(
@@ -10,8 +9,3 @@ ReactDOM.render(
,
document.getElementById('root')
);
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
diff --git a/src/index/index.css b/src/index/index.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/index/index.js b/src/index/index.js
new file mode 100644
index 0000000..0ed4152
--- /dev/null
+++ b/src/index/index.js
@@ -0,0 +1,13 @@
+import { Component } from 'react';
+import './index.css';
+
+// copilot抄来的模板
+export class AppContainer extends Component {
+ render() {
+ return (
+
+ {this.props.children}
+
+ );
+ }
+}
\ No newline at end of file
diff --git a/src/reportWebVitals.js b/src/reportWebVitals.js
deleted file mode 100644
index 5253d3a..0000000
--- a/src/reportWebVitals.js
+++ /dev/null
@@ -1,13 +0,0 @@
-const reportWebVitals = onPerfEntry => {
- if (onPerfEntry && onPerfEntry instanceof Function) {
- import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
- getCLS(onPerfEntry);
- getFID(onPerfEntry);
- getFCP(onPerfEntry);
- getLCP(onPerfEntry);
- getTTFB(onPerfEntry);
- });
- }
-};
-
-export default reportWebVitals;
diff --git a/src/upload/upload.css b/src/upload/upload.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/upload/upload.js b/src/upload/upload.js
new file mode 100644
index 0000000..35129c9
--- /dev/null
+++ b/src/upload/upload.js
@@ -0,0 +1,31 @@
+import { Component } from 'react';
+import './upload.css';
+
+// copilot抄来的模板
+export class UploadContainer extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ files: []
+ };
+ }
+
+ handleChange = (e) => {
+ const files = e.target.files;
+ this.setState({ files });
+ };
+
+ render() {
+ return (
+
+
+ {this.state.files.map((file, i) => (
+
+

+
{file.name}
+
+ ))}
+
+ );
+ }
+}
\ No newline at end of file