react-demo 随便写的
import axios from 'axios';
import { useEffect, useState } from 'react';
import './App.css';
function App() {
const [sum, setSum] = useState(0)
const [count, setCount] = useState(1)
const handleItem = () => {
setSum((sum) => sum + 1)
}
const handleItemV = () => {
setCount(count + 1)
}
useEffect(() => {
console.log('init', window);
axios.get('http://localhost:55555/').then((res) => {
console.log('res',res);
})
}, [])
useEffect(() => {
console.log('sum', sum);
}, [sum])
return (
<div className="App" >
<div className='state_box body'>
<p>Sum {sum}</p>
<p>Count {count}</p>
</div>
<div className='parent_box' id='parent_box'>
<div className='box' id='box'
onClick={() => {
console.log('box');
}}>
this is a pencil
</div>
</div>
<button onClick={handleItem} >button- sum</button>
<div>
<button onClick={handleItemV} >button - count</button>
</div>
</div>
);
}
export default App;
egg项目
安装
npm install --save egg-cors
config\config.default.js
'use strict';
/**
* @param {Egg.EggAppInfo} appInfo app info
*/
module.exports = appInfo => {
/**
* built-in config
* @type {Egg.EggAppConfig}
**/
const config = exports = {
// 支持post请求
security: {
csrf: {
enable: false,
},
},
cluster: {
listen: {
port: 55555,
hostname: '127.0.0.1', // 不建议设置 hostname 为 '0.0.0.0',它将允许来自外部网络和来源的连接,请在知晓风险的情况下使用
},
},
mongoose: {
client: {
// 链接到本地的MongoDB,note是我本地数据库的名字
url: 'mongodb://127.0.0.1:27017/note',
options: {
// dbName: 'note',
// useNewUrlParser: true,
useUnifiedTopology: true,
},
},
},
view: {
defaultViewEngine: 'nunjucks',
mapping: {
'.tpl': 'nunjucks',
},
},
multipart: {
mode: 'stream',
whitelist: [ '.txt', '.css', '.xml' ],
fileSize: '50mb',
},
bodyParser: {
jsonLimit: '1mb',
formLimit: '1mb',
},
cors: {
origin: '*', // 跨任何域
allowMethods: 'GET,HEAD,PUT,POST,DELETE,PATCH,OPTIONS', // 被允许的请求方式
},
};
// use for cookie sign key, should change to your own and keep security
config.keys = appInfo.name + '_1682063943419_2410';
// add your middleware config here
config.middleware = [];
// add your user config here
const userConfig = {
// myAppName: 'egg',
};
return {
...config,
...userConfig,
};
};
config\plugin.js
'use strict';
/** @type Egg.EggPlugin */
module.exports = {
mongoose: {
enable: true,
package: 'egg-mongoose',
},
nunjucks: {
enable: true,
package: 'egg-view-nunjucks',
},
oss: {
enable: true,
package: 'egg-oss',
},
cors: {
enable: true,
package: 'egg-cors',
},
};