vue给对象动态添加属性和值的实例


Posted in Javascript onSeptember 09, 2019

一、背景

介绍:在vue中请求接口中,一个请求方法可能对应后台两个请求接口,所以请求参数就会有所不同。需要我们先设置共同的参数,然后根据条件动态添加参数属性。

二、案例

let that = this;  
let params = {
 "type":that.addQueTable.type,
 "discussTitle":that.addQueTable.discussTitle, 
};
// 区分普通题库还是模考题库
let addQuestionApi = '';
if(that.questionTypes == 0){
  // 动态设置vue对象参数
  Vue.set(params,'charpterId',that.charpterIds)
 addQuestionApi = api.saveBgInfoQuestion;
 }else{
 Vue.set(params,'mockexamSectionId',that.charpterIds);
 addQuestionApi = api.saveMockQuestion;
 }
that.$refs.addQueTable.validate((valid) => {
 if(valid){
 that.$axios({
 url:addQuestionApi,
 method: "post",
 data: qs.stringify(params),
 headers: {
 "Content-Type": "application/x-www-form-urlencoded"
 }
}).....

三、使用介绍

// 1、页面导入Vuejs文件库
import Vue from 'vue'
// 2、Vue.set即可,按照上面方式

以上这篇vue给对象动态添加属性和值的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery分页插件jpaginate在IE中不兼容问题
Apr 22 Javascript
在css加载完毕后自动判断页面是否加入css或js文件
Sep 10 Javascript
javascript实现密码强度显示
Mar 18 Javascript
详解Bootstrap创建表单的三种格式(一)
Jan 04 Javascript
JS搜狐面试题分析
Dec 16 Javascript
JS正则子匹配实例分析
Dec 22 Javascript
JS基于面向对象实现的多个倒计时器功能示例
Feb 28 Javascript
JS自动生成动态HTML验证码页面
Jun 14 Javascript
Angular2 组件交互实例详解
Aug 24 Javascript
Javascript 编码约定(编码规范)
Mar 11 Javascript
微信小程序和H5页面间相互跳转代码实例
Sep 19 Javascript
JavaScript数组排序的六种常见算法总结
Aug 18 Javascript
关于layui表单中按钮自动提交的解决方法
Sep 09 #Javascript
layui原生表单验证的实例
Sep 09 #Javascript
layui的表单提交以及验证和修改弹框的实例
Sep 09 #Javascript
layui插件表单验证提交触发提交的例子
Sep 09 #Javascript
Node.js之删除文件夹(含递归删除)代码实例
Sep 09 #Javascript
layer.confirm点击第一个按钮关闭弹出框的方法
Sep 09 #Javascript
微信小程序 wx:for遍历循环使用实例解析
Sep 09 #Javascript
You might like
PHP四舍五入、取整、round函数使用示例
2015/02/06 PHP
PHP 前加at符合@的作用解析
2015/07/31 PHP
如何在PHP中使用AES加密算法加密数据
2020/06/24 PHP
同一页面多个商品倒计时JS 基于面向对象的javascript
2012/02/16 Javascript
找出字符串中出现次数最多的字母和出现次数精简版
2012/11/07 Javascript
浅析JavaScript中的typeof运算符
2013/11/30 Javascript
ie 7/8不支持trim的属性的解决方案
2014/05/23 Javascript
jquery实现鼠标滑过小图查看大图的方法
2015/07/20 Javascript
javascript 解决浏览器不支持的问题
2016/09/24 Javascript
微信小程序 传值取值的几种方法总结
2017/01/16 Javascript
Vuejs入门教程之Vue生命周期,数据,手动挂载,指令,过滤器
2017/04/19 Javascript
nodejs创建简易web服务器与文件读写的实例
2017/09/07 NodeJs
nodejs操作mongodb的增删改查功能实例
2017/11/09 NodeJs
Layui数据表格之获取表格中所有的数据方法
2018/08/20 Javascript
vue.js项目 el-input 组件 监听回车键实现搜索功能示例
2018/08/25 Javascript
微信小程序实现商品属性联动选择
2019/02/15 Javascript
Angular如何由模板生成DOM树的方法
2019/12/23 Javascript
[46:44]VG vs TNC Supermajor小组赛B组败者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
[01:14:30]TNC vs VG 2019国际邀请赛淘汰赛 胜者组赛BO3 第二场 8.20.mp4
2019/08/22 DOTA
[03:00]DOTA2-DPC中国联赛1月18日Recap集锦
2021/03/11 DOTA
Python列表list内建函数用法实例分析【insert、remove、index、pop等】
2017/07/24 Python
对python使用http、https代理的实例讲解
2018/05/07 Python
windows安装TensorFlow和Keras遇到的问题及其解决方法
2019/07/10 Python
windows下的pycharm安装及其设置中文菜单
2020/04/23 Python
使用Html5中的cavas画一面国旗
2019/09/25 HTML / CSS
美国百货齐全的精品网站,提供美式风格的产品:Overstock.com
2016/07/22 全球购物
KEEN美国官网:美国人气户外休闲鞋品牌
2021/03/09 全球购物
说出数据连接池的工作机制是什么?
2013/04/19 面试题
《蜗牛》教学反思
2014/02/18 职场文书
《乞巧》教学反思
2014/02/27 职场文书
乡镇网格化管理实施方案
2014/03/23 职场文书
三年级小学生评语
2014/04/22 职场文书
给老婆的保证书范文
2014/04/28 职场文书
医院信息公开实施方案
2014/05/09 职场文书
银行自荐信怎么写
2015/03/05 职场文书
使用python生成大量数据写入es数据库并查询操作(2)
2022/09/23 Python