vue中get方法传递数据

之前没有接触过用get方法像后端传递数据

后端接口是这样的

method:GET ,  必传flag,id

然后封装接口,  通过拼接传递

export function update(id, flag) {

  return request({

    url: "/ceshi/updateceshi?id=" + id+ "&flag=" + flag,

    method: "get",

  });

}

.vue文件中引入js文件,定义方法。  我这个需求是如果flag==1,就是发放,flag==0就是暂停发放

handleSet (row) {
      var params = {
        id: row.id,
        flag: "",
      }
      var flag = "";
      if (row.flag == 0) {
        //发放
        flag = 1
      } else if (row.flag == 1) {
        //暂停发放
        flag = 0
      }
      console.log(row);
     
      updateceshi(row.id, flag).then(reobj => {
        console.log(reobj);
        if (reobj.code == 200) {
          this.getList();
          this.$modal.msgSuccess("修改成功");
        } else {
          this.$message({
            message: reobj.message,
            type: "error"
          });
        }
      }, error => {
        this.$message({
          message: error.message,
          type: "error"
        });
      })
    },

页面通过v-if控制显示

<el-button v-if="scope.row.flag=='1'"
                     :disabled="Date.parse(scope.row.endTime) < new Date()"
                     v-on:click="handleSet(scope.row)"
                     type="text">发放</el-button>
          <el-button v-if="scope.row.flag=='0'"
                     :disabled="Date.parse(scope.row.endTime) < new Date()"
                     v-on:click="handleSet(scope.row)"
                     type="text">暂停发放</el-button>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 在 Vue.js 使用 vue-resource 来进行 GET 请求并传递表单数据,可以使用 $http.get() 方法,并在请求的参数传入表单数据。 示例: ``` this.$http.get('api/form', { params: { formData: this.form } }).then(response => { // 处理响应 }, response => { // 处理错误 }); ``` 其,'api/form' 是请求的地址,this.form 是表单数据。 注意: 如果后端服务器不支持 GET 请求带参数,可以尝试使用 POST 或其他请求方式。 ### 回答2: 在Vue.js,可以通过`vue-resource`库来发送GET请求并传递表单数据。首先,您需要安装`vue-resource`库。可以通过以下命令来安装: ``` npm install vue-resource ``` 安装完成后,在您的Vue.js项目引入`vue-resource`: ```javascript import Vue from 'vue' import VueResource from 'vue-resource' Vue.use(VueResource) ``` 接下来,您可以在Vue组件使用`this.$http.get`方法来发送GET请求。为了传递表单数据,您需要将表单数据作为参数传递给该方法。示例如下: ```javascript this.$http.get('/api/data', { params: this.formData }) .then(response => { // 处理响应 }) .catch(error => { // 处理错误 }) ``` 上述示例,`this.formData`是一个包含表单数据的对象。在GET请求,`params`选项用于传递参数。`this.$http.get`方法返回一个Promise对象,您可以通过`.then`方法处理成功响应,通过`.catch`方法处理错误。 当GET请求发送时,`vue-resource`会将表单数据编码为URL参数并附在请求URL。例如,如果`this.formData`为`{ name: 'John', age: 25 }`,那么请求URL将变为`/api/data?name=John&age=25`。 通过上述步骤,您可以使用`vue-resource`库进行GET请求并传递表单数据。 ### 回答3: Vue-resource 是一个基于 Vue.js 的网络请求库,它可以通过 GET 方法来传递表单数据。 使用 Vue-resource 的 GET 方法,可以通过设置请求的 URL 参数,来传递表单数据。首先,需要在 Vue 组件引入 Vue-resource: ```javascript import Vue from 'vue' import VueResource from 'vue-resource' Vue.use(VueResource) ``` 然后,可以通过在组件的 methods 定义一个发送 GET 请求的方法,来传递表单数据。例如: ```javascript methods: { sendData() { // 接收表单数据 const formData = { name: this.name, age: this.age, email: this.email } // 发送 GET 请求 this.$http.get('http://example.com/api/formData', formData).then(response => { // 处理请求成功的响应 console.log(response.body) }, error => { // 处理请求失败的响应 console.error(error) }) } } ``` 在上述代码,sendData() 方法接收表单数据,然后通过 this.$http.get() 方法发送 GET 请求,同时将表单数据作为第二个参数传递进去。之后,根据请求的结果,可以在 then() 方法和 catch() 方法处理成功或失败的响应。 需要注意的是,在发送 GET 请求时,表单数据是通过 URL 参数的方式进行传递的,所以需要根据实际情况在后端进行处理。如果需要传递较大的表单数据,建议使用 POST 方法,并将表单数据放在请求的 body 进行传递。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值