//在script中先引用
import api from './../../api/index'
//vue文件方法中 写
del(index, row) {
let self=this;
// 传的值放para中。
let para = {
Rulesid: row.id
}
//单击后弹出框,单击确定执行.then,单击取消执行.catch
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// 确定后调用接口位置。
//api是引用的index.js页面,找到index.js页面的delrules接口
//触发后传para中的值,成功之后返回的信息放在res中
api.delrules(para).then((res) => {
this.$message({
message: res.msg,
type: 'success'
});
//成功之后重新调用显示表格接口,相当于刷新页面
this.getSystemList();
//接口调用失败时,触发.catch
}).catch(function () {
self.$message.error('网络异常,请重试');
})
//单击取消按钮执行此步
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
})
},

Vue文件

//index.js文件
// 删除制度
delrules(information){
//所传的值都放在information中
var params = new URLSearchParams();
params.append('Rulesid', information.Rulesid);
return axios.post('/api/CanteenAdmin/CanteenManagement/DeleteRules',params)
.then(function (response) {
//成功之后返回信息都在response中
return response;
})
//失败之后
.catch(function (){
alert("请求接口失败,请重试!");
})
},

index.js文件

vue问题一:触发接口的更多相关文章

  1. vue之回车触发表单提交

    vue之回车触发表单提交 操作: 在From标签中添加: @keyup.enter.native="handleSubmit" 注意: 1.若添加在Input标签上,只有聚焦在该i ...

  2. vue中axios调用接口和用node.js跨域

    <script>const API_PROXY = 'https://bird.ioliu.cn/v1/?url='import axios from 'axios'export defa ...

  3. vue 配合vue-resource调用接口,获取数据

    1.先用node+express+mysql简单配置一下后台 const express = require('express');const mysql = require('mysql');con ...

  4. vue v-time指令封装(接口返回时间戳 在到日期转换)

    // 全局时间戳转换指令注册Vue.directive('time',{ bind: function (el,binding) { let getTime = new Date(binding.va ...

  5. Vue $emit()不触发方法的原因

    vue使用$emit时,父组件无法触发监听事件的原因是: $emit传入的事件名称只能使用小写,不能使用大写的驼峰规则命名

  6. 结合vue展示百度天气接口天气预报

    HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  7. vue+webpack+express中间件接口使用

    环境:vue 2.9.3; webpack 目的:接口的调用 跨域方式: 1.express中间的使用 2.nginx代理 3.谷歌浏览器跨域设置 -------------------------- ...

  8. vue打包后,接口请求404的完美解决方案

    在开发环境中,和后台对接为了解决跨域问题,使用了代理,也就是vue的proxyTable,但是打包放到生产环境中去时,接口请求不到,404,原因是开发环境的代理并不能用到生产环境,但是直接在请求接口是 ...

  9. vue项目axios请求接口,后端代理请求接口404,问题出现在哪?

    在vue项目中,列表数据需要用到qq音乐接口中的数据,但是直接请求不行,有host及referer限制,需要采用后端代理的方式.借助axios及node的express,在dev-server.js中 ...

随机推荐

  1. Android系统修改之葡萄牙沃达丰One Net服务问题处理

    客户反馈的葡萄牙沃达丰的OneNet服务问题 Vodafone Portugal have a service (One Net) for enterprise customers that used ...

  2. 【未知来源】K-th String

    题意 求有多少种 前 \(n\) 个小写字母的排列 \(t\),满足其所有子串按字典序从小到大排列,第 \(k\) 个子串是一个给定字符串 \(s\).答案模 \(10^9+7\). \(1\le n ...

  3. JavaScript 的 this 指向问题深度解析

    与我们常见的很多语言不同,JavaScript 函数中的 this 指向并不是在函数定义的时候确定的,而是在调用的时候确定的.换句话说,函数的调用方式决定了 this 指向. JavaScript 中 ...

  4. centos7中使用yum安装tomcat mysql 等

    安装Tomcat 进入 # cd /usr/local/tomcat # wget http://mirrors.tuna.tsinghua.edu.cn/apache/tomcat/tomcat-7 ...

  5. mybatis解析和基本运行原理

    Mybatis的运行过程分为两大步: 第1步,读取配置文件缓存到Configuration对象,用于创建SqlSessionFactory: 第2步,SqlSession的执行过程.相对而言,SqlS ...

  6. jmeter-响应有中文时,显示乱码

    Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet

  7. JavaScript分支结构Ⅰ—IF-ELSE

    ㈠程序 ⑴程序的流程控制 程序=数据+算法 ⑵程序的三种结构: ①顺序结构 ②分支结构 ③循环结构 ㈡IF结构 ⑴什么是分支结构? 程序在运行过程中,根据不同的条件,选择执行某些语句 ⑵什么是IF结构 ...

  8. C# 输出双引号

    Response.Write("前一页面的标题是:\"" +Page.PreviousPage.Title.ToString()+"\"") ...

  9. poj 3623(贪心)

    Best Cow Line, Gold Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 6038   Accepted: 20 ...

  10. BZOJ 3456 城市规划 (组合计数、DP、FFT)

    题目链接: https://www.lydsy.com/JudgeOnline/problem.php?id=3456 著名的多项式练习题,做法也很多,终于切掉了纪念 首先求一波递推式: 令\(F(n ...