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 相关文章推荐
xml 封装与解析(javascript和C#中)
Jul 26 Javascript
扩展easyui.datagrid,添加数据loading遮罩效果代码
Nov 02 Javascript
能说明你的Javascript技术很烂的五个原因分析
Oct 28 Javascript
JS时间选择器 兼容IE6,7,8,9
Jun 26 Javascript
Javascript中的Array数组对象详谈
Mar 03 Javascript
javascript中为某个元素指定事件的三种方式
Aug 07 Javascript
JS实现table表格数据排序功能(可支持动态数据+分页效果)
May 26 Javascript
Web 开发中Ajax的Session 超时处理方法
Jan 19 Javascript
js 获取图像缩放后的实际宽高,位置等信息
Mar 07 Javascript
JS简单实现获取元素的封装操作示例
Apr 07 Javascript
vue.js国际化 vue-i18n插件的使用详解
Jul 07 Javascript
详解element-ui级联菜单(城市三级联动菜单)和回显问题
Oct 02 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 stristr() 函数(不区分大小写的字符串查找)
2010/06/03 PHP
php下关于Cannot use a scalar value as an array的解决办法
2010/08/08 PHP
php与mysql建立连接并执行SQL语句的代码
2011/07/04 PHP
单一index.php实现PHP任意层级文件夹遍历(Zjmainstay原创)
2012/07/31 PHP
分享一个超好用的php header下载函数
2014/01/31 PHP
php使用fgetcsv读取csv文件出现乱码的解决方法
2014/11/08 PHP
PHP6连接SQLServer2005的三部曲
2016/04/15 PHP
php结合mysql与mysqli扩展处理事务的方法
2016/06/29 PHP
mysql alter table命令修改表结构实例详解
2016/09/24 PHP
PHP实现小偷程序实例
2016/10/31 PHP
Thinkphp 框架扩展之应用模式实现方法分析
2020/04/27 PHP
Jquery插件之打造自定义的select标签
2011/11/30 Javascript
JavaScript 验证码的实例代码(附效果图)
2013/03/22 Javascript
jQuery圆形统计图开发实例
2015/01/04 Javascript
jQuery实现带动画效果的多级下拉菜单代码
2015/09/08 Javascript
JavaScript模拟数组合并concat
2016/03/06 Javascript
jQuery异步提交表单实例
2017/05/30 jQuery
JS实现的按钮点击颜色切换功能示例
2017/10/19 Javascript
详解vue mixins和extends的巧妙用法
2017/12/20 Javascript
VUE DEMO之模拟登录个人中心页面之间数据传值实例
2019/10/31 Javascript
[06:59]DOTA2-DPC中国联赛3月7日Recap集锦
2021/03/11 DOTA
python实现自动更换ip的方法
2015/05/05 Python
python+splinter自动刷新抢票功能
2018/09/25 Python
python全栈要学什么 python全栈学习路线
2019/06/28 Python
Python中的四种交换数值的方法解析
2019/11/18 Python
Python Web项目Cherrypy使用方法镜像
2020/11/05 Python
使用CSS3的rem属性制作响应式页面布局的要点解析
2016/05/24 HTML / CSS
利用纯CSS3实现文字向右循环闪过效果实例(可用于移动端)
2017/06/15 HTML / CSS
全球性的在线购物网站:Zapals
2017/03/22 全球购物
有影响力的品牌之家:Our Social Collective
2019/06/08 全球购物
企业管理毕业生求职信范文
2014/03/07 职场文书
机电系毕业生求职信
2014/07/11 职场文书
党员个人对照检查材料
2014/10/01 职场文书
归元寺导游词
2015/02/06 职场文书
python 下载文件的几种方式分享
2021/04/07 Python
redis限流的实际应用
2021/04/24 Redis