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 相关文章推荐
Javascript面向对象编程(二) 构造函数的继承
Aug 28 Javascript
ASP.NET jQuery 实例15 通过控件CustomValidator验证CheckBoxList
Feb 03 Javascript
javascript数组的使用
Mar 28 Javascript
使用JavaScript进行进制转换将字符串转换为十进制
Sep 21 Javascript
JavaScript中的对象与JSON
Jul 03 Javascript
jQuery仅用3行代码实现的显示与隐藏功能完整实例
Oct 08 Javascript
DOM操作和jQuery实现选项移动操作的简单实例
Jun 07 Javascript
JavaScript中原型链存在的问题解析
Sep 25 Javascript
深入理解Javascript箭头函数中的this
Feb 13 Javascript
javascript数据结构之串的概念与用法分析
Apr 12 Javascript
微信小程序支付PHP代码
Aug 23 Javascript
如何封装了一个vue移动端下拉加载下一页数据的组件
Jan 06 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
消息持续发送的完整例子
2006/10/09 PHP
ThinkPHP框架任意代码执行漏洞的利用及其修复方法
2014/07/04 PHP
discuz目录文件资料汇总
2014/12/30 PHP
PHP文件操作之获取目录下文件与计算相对路径的方法
2016/01/08 PHP
微信自定义分享php代码分析
2016/11/24 PHP
jquery 跨域访问问题解决方法(笔记)
2011/06/08 Javascript
javascript表单验证 - Parsley.js使用和配置
2013/01/25 Javascript
jquery 表格的增行删行实现思路
2013/03/21 Javascript
js简易namespace管理器 实例代码
2013/06/21 Javascript
浅析javascript操作 cookie对象
2014/12/26 Javascript
每天一篇javascript学习小结(Boolean对象)
2015/11/12 Javascript
表单input项使用label同时引用Bootstrap库导致input点击效果区增大问题
2016/10/11 Javascript
jQuery实现发送验证码并60秒倒计时功能
2016/11/25 Javascript
文件上传的几个示例分享【推荐】
2016/12/16 Javascript
老生常谈jquery中detach()和remove()的区别
2017/03/02 Javascript
使用vue.js写一个tab选项卡效果
2017/03/25 Javascript
JavaScript 函数的定义-调用、注意事项
2017/04/16 Javascript
JavaScript实现简单的星星评分效果
2017/05/18 Javascript
不得不看之JavaScript构造函数及new运算符
2017/08/21 Javascript
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
2018/08/28 jQuery
Vue实现调节窗口大小时触发事件动态调节更新组件尺寸的方法
2018/09/15 Javascript
配置eslint规范项目代码风格
2019/03/11 Javascript
微信小程序的开发范式BeautyWe.js入门详解
2019/07/10 Javascript
layui监听工具栏的实例(操作列表按钮)
2019/09/10 Javascript
Python实现简单网页图片抓取完整代码实例
2017/12/15 Python
Python第三方Window模块文件的几种安装方法
2018/11/22 Python
pytorch获取vgg16-feature层输出的例子
2019/08/20 Python
Python+Appium实现自动化测试的使用步骤
2020/03/24 Python
Python中实现一行拆多行和多行并一行的示例代码
2020/09/06 Python
python 合并多个excel中同名的sheet
2021/01/22 Python
Skip Hop官网:好莱坞宝宝挚爱品牌
2018/06/17 全球购物
伦敦一卡通:The London Pass
2018/11/30 全球购物
ZINVO手表官网:男士和女士手表
2019/03/10 全球购物
小学生打架检讨书
2014/01/26 职场文书
学校重阳节活动总结
2015/03/24 职场文书
Python爬虫网络请求之代理服务器和动态Cookies
2022/04/12 Python