fetch 请求java后台接收不到参数解决如下：

很明显axios请求的Content-Type为application-json，所以后台接收不到

解决：参数使用第三方工具qs.stringify(param) 处理，然后Content-Type设置为 application/x-www-form-urlencoded，注意，Request Payload 和 Form Data 的区别，主要是参数放的不对导致获取不到
参考参考2 参考3 参考4

React------The “injectBabelPlugin” helper has been deprecated as of v2.0. 报错

使用Antd,会有报错

引入 react-app-rewired 并修改 package.json 里的启动配置。由于新的 react-app-rewired@2.x 版本的关系，你还需要安装 customize-cra，否则会出现如下的问题。

The "injectBabelPlugin" helper has been deprecated as of v2.0. You can use customize-cra plugins in replacement - https://github.com/
arackaf/customize-cra#available-plugins
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! my_cnode@0.1.0 start: `react-app-rewired start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the my_cnode@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Administrator\AppData\Roaming\npm-cache\_logs\2019-04-25T06_55_17_287Z-debug.log

解决如下：

确保安装’customize-cra’并react-app-rewired@2.x
确保安装’less’和’less-loader’
src目录新建 config-overrides.js 文件
内容如下：

const {override,fixBabelImports,addLessLoader,} = require("customize-cra");module.exports = override(fixBabelImports("import", {libraryName: "antd", libraryDirectory: "es", style: true // change importing css to less}),addLessLoader({javascriptEnabled: true,modifyVars: { "@primary-color": "#1DA57A" }}));

记得关闭项目，重新启动
参考参考

react中配置代理解决跨域问题
项目中遇到请求跨域问题，我们一般需要项目中配置代理解决。
我的项目是create-react-app2.0版本生成的。
首先安装包 http-proxy-middleware

npm install http-proxy-middleware --save
# or
yarn add http-proxy-middleware

然后在src目录下创建 setupProxy.js 文件
最后设置代理

// setupProxy.js
const proxy = require('http-proxy-middleware')module.exports = function(app) {app.use(proxy('/api', {  //`api`是需要转发的请求 target: 'http://localhost:5000',  // 这里是接口服务器地址changeOrigin: true,}))
}

这里需要注意的是我们的axios的baseURL，设置的时候不能还设置加上原来服务器域名的地址，应该只设置 /api 就好了

axios.defaults.baseURL = '/api';
例如：
axios.post('/v1/register');

发布的时候可以使用nignx转发解决跨域，测试也可以


#user  nobody;
worker_processes  1;#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;#pid        logs/nginx.pid;events {worker_connections  1024;
}http {include       mime.types;default_type  application/octet-stream;#log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '#                  '$status $body_bytes_sent "$http_referer" '#                  '"$http_user_agent" "$http_x_forwarded_for"';#access_log  logs/access.log  main;sendfile        on;#tcp_nopush     on;#keepalive_timeout  0;keepalive_timeout  65;#gzip  on;server {listen       8048;server_name  localhost;  add_header Access-Control-Allow-Origin *;add_header Access-Control-Allow-Methods 'GET,POST';add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';  #charset koi8-r;#access_log  logs/host.access.log  main;location / {root   html/build;index  index.html index.htm;proxy_pass  http://60.64.5.51:8038;     #请求转向mysvr 定义的服务器列表  }#error_page  404              /404.html;# redirect server error pages to the static page /50x.html#error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}# 代理接口地址配置location ^~/cfcExceptionEvent/v1/ {proxy_pass   http://111.231.97.228:10002;proxy_set_header   X-Forwarded-Proto $scheme;proxy_set_header   Host              $http_host;proxy_set_header   X-Real-IP         $remote_addr;     #   rewrite ^/cfcExceptionEvent/v1/(.*)$ /$1 break;}# proxy the PHP scripts to Apache listening on 127.0.0.1:80##location ~ \.php$ {#    proxy_pass   http://127.0.0.1;#}# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000##location ~ \.php$ {#    root           html;#    fastcgi_pass   127.0.0.1:9000;#    fastcgi_index  index.php;#    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;#    include        fastcgi_params;#}# deny access to .htaccess files, if Apache's document root# concurs with nginx's one##location ~ /\.ht {#    deny  all;#}}# another virtual host using mix of IP-, name-, and port-based configuration##server {#    listen       8000;#    listen       somename:8080;#    server_name  somename  alias  another.alias;#    location / {#        root   html;#        index  index.html index.htm;#    }#}# HTTPS server##server {#    listen       443 ssl;#    server_name  localhost;#    ssl_certificate      cert.pem;#    ssl_certificate_key  cert.key;#    ssl_session_cache    shared:SSL:1m;#    ssl_session_timeout  5m;#    ssl_ciphers  HIGH:!aNULL:!MD5;#    ssl_prefer_server_ciphers  on;#    location / {#        root   html;#        index  index.html index.htm;#    }#}}

参考参考2 参考3 参考4

Ant Mobile使用整理相关推荐

Windows Mobile 系列文章索引---不断整理中(2009-07-08)
Windows Mobile 高级编程系列 ØWindows Mobile 进阶系列.第零回.序 ØWindows Mobile 进阶系列.第一回.真的了解.NET CF吗? ØWindows Mob ...
input 中文输入法额外触发change事件问题
用ant mobile input 组件实现下面输入提示,提示添加click事件,input 添加change事件. 预期:点击提示项的时候,预期是只触发click事件. 实际:英文输入法正常,只触发 ...
Ant Design Mobile是什么？
Ant Design Mobile简称antd-mobile,是Ant Design的移动规范的React实现,是一个基于Preact/React/React Native的UI组件库:UI样式高度可 ...
react-hooks+Ant Design Mobile中的自定义表单验证
Ant Design Mobile中的表单校验将validator放在 rules 对象中 <Form.Itemname='uName'label='姓名'requiredrules={[{r ...
Ant Design Mobile 5.6.0版本来了
一.Ant Design Mobile介绍 Ant Design Mobile( 官网地址:Ant Design Mobile - Ant Design Mobile ) 是由支付宝设计团队基于蚂蚁集 ...
如何修改ant design mobile或者其他UI组件的全局样式
问题描述: 有时候你可能会遇到一些前端CSS实现上的问题,因为美工的画图与你的项目使用的UI框架的样式大有出入,所以在写页面样式的时候多多少少会让你有些头疼,那么该类问题应该如何解决呢? 原因分析: ...
ant design mobile listView 使用
ListView.DataSource 的使用 https://cloud.tencent.com/developer/section/1373979 https://mobile.ant.desig ...
2020年React Native使用Ant Design Mobile RN组件
Ant Design Mobile RN是一个很优秀的React Native 界面库,可以帮助我们简单方便的开发出漂亮的界面.我在基于0.63版本使用的过程中遇到一些小波折,比如字体无法正常,各种红 ...
[整理]Windows Mobile(.NET CF)开发的书籍
Microsoft Mobile移动开发宝典(微软技术丛书) 基于.NET CF 2.0,C#语言内容比较全面,写得较详细,整体感觉不错. Microsoft. NTE Compact Framew ...

Ant Mobile使用整理

发布的时候可以使用nignx转发解决跨域，测试也可以

Ant Mobile使用整理相关推荐

最新文章

热门文章