Vue向后台提交数据，C#一般处理程序接收数据
前端：<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title></title>...
前端：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="js/vue.min.js"></script>
<script src="js/vue-resource.js"></script>
</head>
<body>
<div id="container">
<button v-on:click="btnAdd_click">添加数据</button>
<table>
<thead>
<tr>
<th>编号</th>
<th>标题</th>
<th>作者</th>
<th>时间</th>
</tr>
</thead>
<tbody>
<tr v-for="user in userList">
<td>{{ user.id }}</td>
<td>{{ user.title }}</td>
<td>{{ user.author }}</td>
<td>{{ user.addTime }}</td>
</tr>
</tbody>
</table>
</div>
<script>
var uList = [];
Vue.http.interceptors.push(function (request, next) {
// ...
// 请求发送前的处理逻辑
// ...
console.log("请求发送前的处理逻辑")
next(function (response) {
// ...
// 请求发送后的处理逻辑
// ...
// 根据请求的状态，response参数会返回给successCallback或errorCallback
console.log("请求发送后的处理逻辑")
return response
})
})
Vue.http.get("WebForm8.aspx").then(function (res) {
console.log("请求成功响应")
console.log(res.json().rows);
uList = res.json().rows;
var vue = new Vue({
el: "#container",
data: {
userList: uList
},
methods: {
btnAdd_click: function () {
var user = {
id: 10,
title: "最新消息",
author: "张三",
addTime:"2019-5-19"
};
this.$http.post("WebForm1.aspx", user)
.then(function (res) {
console.log(res.text());
alert("添加完成");
}, function (err) {
console.log(err);
});
}
}
});
}, function (res) {
console.log(res);
});
</script>
</body>
</html>
后端：WebForm8.aspx(浏览功能)
DataTable dt= DBHelper.GetDataTable("select * from TBInfors");
int number = dt.Rows.Count;//获取数量
string jsonstr = JsonConvert.SerializeObject(dt);//转换为json字符串
// Response.Write("\"total\":\""+number+"\",\"rows\":");
Response.Write("{\"total\":\"" + number + "\",\"rows\":");
Response.Write(jsonstr);
Response.Write("}");
后端：WebForm1.aspx（添加，修改，删除功能的实现方式）
StreamReader stream = new StreamReader(Context.Request.InputStream);
string payload = stream.ReadToEnd();
object Jonstr = JsonConvert.DeserializeObject(payload);
var dynData = (TBInfors)JsonConvert.DeserializeObject(payload, typeof(TBInfors));
剩下的diam操作dynData的对象数据就可以了，其他代码省略
前往低代码交流专区
更多推荐
0
0- 0
已为社区贡献1条内容
所有评论(0)