在实际的开发过程中,给表单元素绑定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. three.js 数学方法之Plane

    今天郭先生就来继续说一说three.js数学方法中的plane(平面).在三维空间中无限延伸的二维平面,平面方程用单位长度的法向量和常数表示.构造器为Plane( normal : Vector3, ...

  2. placeholder CSS设置

    IE似乎一个冒号才生效,而chrome则是两个冒号才生效 input::-webkit-input-placeholder{ color:red; } input:-ms-input-placehol ...

  3. 从零开始学Python网络爬虫PDF高清完整版免费下载|百度网盘

    百度网盘:从零开始学Python网络爬虫PDF高清完整版免费下载 提取码:wy36 目录 前言第1章 Python零基础语法入门 11.1 Python与PyCharm安装 11.1.1 Python ...

  4. 小书MybatisPlus第8篇-逻辑删除实现及API细节精讲

    本文为Mybatis Plus系列文章的第8篇,前7篇访问地址如下: 小书MybatisPlus第1篇-整合SpringBoot快速开始增删改查 小书MybatisPlus第2篇-条件构造器的应用及总 ...

  5. Fortify Audit Workbench 笔记 Command Injection(命令注入)

    Command Injection(命令注入) Abstract 执行不可信赖资源中的命令,或在不可信赖的环境中执行命令,都会导致程序以攻击者的名义执行恶意命令. Explanation Comman ...

  6. zookeeper 源码编译

    环境:mac 1.github上下载 源码 项目地址:https://github.com/apache/zookeeper 2.安装 ant mac:brew update ->  brew ...

  7. Python os.tempnam() 方法

    概述 os.tempnam() 方法用于返回唯一的路径名用于创建临时文件.高佣联盟 www.cgewang.com 语法 tempnam()方法语法格式如下: os.tempnam(dir, pref ...

  8. Python os.fchdir() 方法

    概述 os.fchdir() 方法通过文件描述符改变当前工作目录.高佣联盟 www.cgewang.com Unix, Windows 上可用. 语法 fchdir()方法语法格式如下: os.fch ...

  9. day16.内置方法与模块

    一.内置方法 1.abs 绝对值函数 res = abs(-100) print(res) 2.round 四舍五入 (n.5 n为偶数则舍去 n.5 n为奇数,则进一!) ""& ...

  10. Spring中使用MyBatis Generator

    简介 MyBatis Generator 是由MyBatis官方提供的MyBatis代码生成器.可以根据数据库表生成相关代码,比如POJO.Mapper接口.SQL Map xml等. 使用方式 MB ...