在实际的开发过程中,给表单元素绑定model的时候,绑定的元素的属性是根据后台数据动态生成的。如果使用常规的赋值方式,是无法更新视图的

  • 需要使用, this.$set(dataName,keyName,keyValue)
export default {
data:{
// 先定义一个空对象
formObject:{}
},
mounted() {
this.initPage()
},
methods:{
initPage(){
this.$store.dispatch(namespace/callData).then(res=>{
// 给数据设置key-value
res.data.forEach(item=>{
// this.formObject[item.name] = item.value // 这种方式是不能更新视图的
this.$set(this.formObject, item.name, item.value) // 可以更新视图
})
})
}
}
}

Vue 使用$set动态给数据设置属性的更多相关文章

  1. vue组件上动态添加和删除属性

    1.vue组件上动态添加和删除属性 // 添加 this.$set(this.obj, 'propName', val) // 删除 this.$delete(this.obj, 'propName' ...

  2. 【使用JSOUP实现网络爬虫】修改数据-设置属性的值

    问题 在你解析一个Document之后可能想修改其中的某些属性值,然后再保存到磁盘或都输出到前台页面. 方法 可以使用属性设置方法 Element.attr(String key, String va ...

  3. Jquery chosen动态设置值 select Ajax动态载入数据 设置chosen和获取他们选中的值

      在做一个编辑对话框时,要对里面带有select option的操作.主要是想动态载入option和对option的选中.可是由于项目中使用了jquery里的chosen()方法.怎么也无法实现效果 ...

  4. Easyui设置动态表格,动态导出数据实例,附Demo

    最近开发的过程中碰到一个客户提出的需求,一个指定的页面导出需要提供一个弹出页面选择列表页面需要显示的列,页面确认之后需要修改列表页面显示的表格,导出的数据也需要同步变化. 总结一下可以称为一个列表数据 ...

  5. [js高手之路] vue系列教程 - 绑定设置属性的多种方式(5)

    一.设置属性的值: {{data中的数据}} window.onload = function () { var c = new Vue({ el : '#box', data : { url : ' ...

  6. Easyui设置动态表格,动态导出数据实例,附Dome

    最近碰到一个需求,需要提供一个弹出页面选择列表页面需要显示的列,页面确认之后需要修改列表页面显示的表格,导出的数据也需要同步变化. 下面直接上代码 1.设置需要显示的列columus为全局对象,用于子 ...

  7. VUE 动态给对象增加属性,并触发视图更新。

    在开发过程中,我们时常会遇到这样一种情况:当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更新视图的. 根据官方文档定义 ...

  8. 在Delphi中调用"数据链接属性"对话框设置ConnectionString

    项目需要使用"数据链接属性"对话框来设置ConnectionString,查阅了一些资料,解决办法如下: 1.Delphi 在Delphi中比较简单,步骤如下: 方法1: use ...

  9. 046——VUE中组件之使用动态组件灵活设置页面布局

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. Java匿名对象介绍

    Java匿名对象介绍 什么是匿名对象? 顾名思义就是没有变量名的对象,即创建对象时,只有创建对象的语句,却没有把对象地址值赋值给某个变量. 匿名对象命名格式:以Scanner类举例 new Scann ...

  2. 阅读手札 | 手把手带你探索『图解 HTTP』

    前言 本文已经收录到我的 Github 个人博客,欢迎大佬们光临寒舍: 我的 Github 博客 学习清单: 一.网络基础 TCP/IP 通常使用的网络(包括互联网)是在 TCP/IP 协议族的基础上 ...

  3. MySQL组复制MGR(一)-- 技术概述

    (一)复制技术的发展 MySQL的复制技术主要经历了异步主从复制,半同步复制,组复制(Group Replication)3个阶段. (1)传统的异步主从复制 传统的MySQL提供了一种简单的主从复制 ...

  4. expect正则捕获返回结果

    expect正则捕获返回结果 expect: expect -re "([0-9]*)([a-zA-Z]*)"send_user "num is $expect_out( ...

  5. 【Laravel】为Eloquent 模型设置全局作用域和局部作用域进行查询

    全局作用域 所谓「全局作用域」,指的是预置过滤器在注册该「全局作用域」的模型类的所有查询中生效,不需要指定任何额外条件. 以 User 模型类为例,我们在系统中可能只想针对已经验证过邮箱的用户进行操作 ...

  6. 《Python游戏编程快速上手》|百度网盘免费下载|Python基础编程

    <Python游戏编程快速上手>|百度网盘免费下载| 提取码:luy6 Python是一种高级程序设计语言,因其简洁.易读及可扩展性日渐成为程序设计领域备受推崇的语言. 本书通过编写一个个 ...

  7. 如何系统地学习Excel?

    人在江湖,生不由己.人在职场,Excel必备. 为了帮助更多人快速掌握职场必备技能Excel,我写了一个免费的教程<职场Excel>,能帮助你解决99%职场中遇到的问题. 对,你没看错,是 ...

  8. Fortify Audit Workbench 笔记 Path Manipulation

    Path Manipulation Abstract 通过用户输入控制 file system 操作所用的路径,借此攻击者可以访问或修改其他受保护的系统资源. Explanation 当满足以下两个条 ...

  9. ctime使用及datetime简单使用

    from time import ctime,sleep def Clock(func): def clock(): print("现在是:",ctime()) func() sl ...

  10. 字典内置函数&方法

    字典内置函数&方法 Python字典包含了以下内置函数:高佣联盟 www.cgewang.com 序号 函数及描述 1 cmp(dict1, dict2)比较两个字典元素. 2 len(dic ...