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. C#中的垃圾回收

  2. Qt学习笔记(2)-利用StackWidget实现选项卡式页面

    学习笔记第二篇,利用Qt实现选项卡式的页面,效果如图1.1-图1.3所示.程序实现的功能是通过点击状态栏实现不同页面的切换,实际上Qt中自带有Tab选项卡式的控件,本文利用StackWidge实现类似 ...

  3. uwp 之语音朗读

    xml code --------------------------------- <Page x:Class="MyApp.MainPage" xmlns="h ...

  4. Linux 安装配置 NET模式网络环境配置

    1.下载linux:发行版 Ubuntu  REdHat centos Debain Fedora,SUSE,OpenSUSEcentos 6.xcentos 7.x在虚拟机(VmWare)上 安装l ...

  5. JavaWeb 三大器--Listener、Filter 和Interceptor 总结

    说明:web.xml的加载顺序是:[Context-Param]->[Listener]->[Filter]->[Servlet],而同个类型之间的实际程序调用的时候的顺序是根据对应 ...

  6. Linux 自旋锁,互斥量(互斥锁),读写锁

    自旋锁(Spin Lock) 自旋锁类似于互斥量,不过自旋锁不是通过休眠阻塞进程,而是在取得锁之前一直处于忙等待的阻塞状态.这个忙等的阻塞状态,也叫做自旋. 自旋锁通常作为底层原语实现其他类型的锁. ...

  7. Core3.1WebApi使用MongoDB

    好久没有使用MongoDB了,重新测试使用,版本不一样之前很多方法都使用不了了,下面为部分测试,下次再来更新测试 测试中使用的命令 // 新增读写的用户 db.createUser({ user:'f ...

  8. MySQL(四)——

    MySQL官方对索引的定义:索引(Index)是帮助MySQL高效获取数据的数据结构.因此索引的本质就是数据结构.索引的目的在于提高查询效率,可类比字典.书籍的目录等这种形式. 可简单理解为" ...

  9. Redis消息的发布与订阅

  10. shell脚本之case语句

    case ... esac 为多选择语句,与其他语言中的 switch ... case 语句类似,是一种多分枝选择结构,每个 case 分支用右圆括号开始,用两个分号 ;; 表示 break,即执行 ...