1.Vue使用axios post方法发送json数据

<template>
<el-aside>
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="审核选择">
<el-switch
v-model="form.status"
active-text="审核通过"
active-value="2"
inactive-text="审核不通过"
inactive-value="3"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
</el-form-item> <el-form-item label="处理原因">
<el-input type="textarea" v-model="form.reason"></el-input>
</el-form-item> <el-form-item>
<el-button type="primary" @click="onSubmit">提交</el-button>
<el-button @click="cancel">取消</el-button>
</el-form-item>
</el-form> </el-aside>
</template> <script>
import axios from "axios"; export default {
name: "StoreHandler",
data() {
return {
form: {
status: '2',
reason: ''
}
}
}, methods: {
onSubmit() {
console.log(this)
console.log(this.form.status)
console.log(this.form.reason)
console.log(this.$route.query.storeId) const jsons = {
storeId:this.$route.query.storeId,
status: this.form.status,
reason: this.form.reason
}; let _this = this axios({
method: 'post',
url: 'http://localhost:1111/waimai/store/updateStoreStatusAndReason',
data: JSON.stringify(jsons),
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
}).then(function (res) {
console.log(res)
_this.$notify({
title: '提交成功',
message: '处理结果',
type: 'success'
}) _this.$router.push({
path:'/storeApplyList'
})
})
}, cancel() {
this.$router.push({
path: '/storeAppLyList'
})
}
},
}
</script> <style scoped> </style>

Vue使用axios post方法发送json数据报415Unsupported Media Type的更多相关文章

  1. vue之axios请求数据本地json

    写给自己的话:静态的json文件要记得放在static文件夹下,想打自己 1.下载插件 npm install axios --save 2.在main.js下引用axios import axios ...

  2. vue 集成 axios 发送post请求 payload导致后台无法接收到数据问题

    vue 集成axios之后,发送的post请求默认为payload 方式. 如果想改为正常的方式,需要增加headers头,并且将发送是数据json格式改为 querystring的方式. 安装依赖 ...

  3. ajax使用json数组------前端往后台发送json数组及后台往前端发送json数组

    1.引子 Json是跨语言数据交流的中间语言,它以键/值对的方式表示数据,这种简单明了的数据类型能被大部分编程语言理解.它也因此是前后端数据交流的主要方式和基础. 2.前端往后台传输json数据 第一 ...

  4. vue使用axios发送请求,都会发送两次请求

    vue 使用axios,每次的请求都会发送两次,第一次的请求头为options CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sha ...

  5. vue axios使用方法

    首先安装axios: cnpm install axios -save 安装成功后,在main.js页面引用: import axios from 'axios' import Qs from 'qs ...

  6. vue组件+axios访问本地json

    import axios from 'axios'export default { name: "AjaxText", data: function () { return { m ...

  7. 类型:JQuery;问题:ajax调用ashx文件;结果:ashx文件怎么获取$.ajax()方法发送的json数据

    ashx文件怎么获取$.ajax()方法发送的json数据 作者:careful 和ajax相关     新浪微博QQ空间QQ微博百度搜藏腾讯朋友QQ收藏百度空间人人网开心网0 $.ajax({  t ...

  8. 模拟axios的创建[ 实现调用axios()自身发送请求或调用属性的方法发送请求axios.request() ]

    1.axios 函数对象(可以作为函数使用去发送请求,也可以作为对象调用request方法发送请求) ❀ 一开始axios是一个函数,但是后续又给它添加上了一些属性[ 方法属性] ■ 举例子(axio ...

  9. axios 在Vue全局引入的方法

    在main.js中: import axios form axios Vue.prototype.$axios = axios 组件中使用: submitFrom () { this.$axios.g ...

随机推荐

  1. 等待唤醒机制----线程池----lambda表达式

    1.等待唤醒机制 1.1线程间通信 概念:多个线程在处理同一个资源,但是处理的动作(线程的任务)却不相同. 比如:线程A用来生成包子的,线程B用来吃包子的,包子可以理解为同一资源,线程A与线程B处理的 ...

  2. jQuery最后案例:商标展示

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  3. ES6扩展——函数扩展之剩余函数

    1.结合扩展运算符 //剩余参数是做聚合的,扩展运算符是做展开的 function sum(...args){ console.log(arguments); console.log(argument ...

  4. CSS截取字段,让过长的字段结尾变成省略号(IE有效)

    text-overflow:ellipsis;overflow:hidden;<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transiti ...

  5. 一种封装Retrofit的方法,可以自动解析Gson,回避Method return type must not include a type variable or wildcard: retrofit2.Call<T>的问题

    封装目的:屏蔽底层实现,提供统一接口,并支持Gson自动转化 最初封装: //请求方法 interface RequestListener { interface PostListener { @PO ...

  6. shell运算方式

    1.(())--整数运算 [root@m01 /server/scripts]# a=1 [root@m01 /server/scripts]# b=2 [root@m01 /server/scrip ...

  7. 20210821 打表,蛇,购物,ants

    考场 T1 没看懂 T4 一眼回滚莫队,但忘记怎么写了,小慌 模拟 T1 题意的时候教练让 zsy 澄清了一下,确定了我不会做... T2 一看就是毒瘤题,T3 感觉比较可做 T4 确定了回滚的细节, ...

  8. Python - break、continue 的使用

    前置知识 break.continue 会结合循环使用的,所以要先学会循环哦 python 提供了两种循环语句 for 循环:https://www.cnblogs.com/poloyy/p/1508 ...

  9. java 多线程Thread和Runnable的区别

    如果一个类继承Thread,则不适合资源共享.但是如果实现了Runable接口的话,则很容易的实现资源共享 实现Runnable接口比继承Thread类所具有的优势:1. 适合多个相同的程序代码的线程 ...

  10. AI异构通信:重压下的突围,华为P50系列的卓越体验

    撰文 |懂懂 编辑 | 秦言 来源:懂懂笔记 "华为不会让消费者失望."华为消费者业务CEO余承东在P50系列发布会上如是说. 今年4月美国对华为第四轮制裁以来,华为终端产品无缘5 ...