没有合适的资源?快使用搜索试试~ 我知道了~
vue中 this.$set的用法详解
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 28 浏览量
2020-12-29
06:42:15
上传
评论
收藏 25KB PDF 举报
温馨提示
试读
1页
当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性的值,是不会更新视图的。 <template> <div id=app> <p v-for=item key=item.id>{{item.message}}</p> <button class=btn @click=handClick()>更改数据</button> </div> </template> [removed] export default { name: 'App', data () { return {
资源详情
资源评论
资源推荐
vue中中 this.$set的用法详解的用法详解
当vue的data里边声明或者已经赋值过的对象或者数组(数组里边的值是对象)时,向对象中添加新的属性,如果更新此属性
的值,是不会更新视图的。
<template>
<div id="app">
<p v-for="item in items" :key="item.id">{{item.message}}</p>
<button class="btn" @click="handClick()">更改数据</button>
</div>
</template>
<script>
export default {
name: 'App',
data () {
return {
items: [
{ message: "one", id: "1" },
{ message: "two", id: "2" },
{ message: "three", id: "3" }
] }
},
mounted () {
this.items[0] = { message:'first',id:'4'} //此时对象的值更改了,但是视图没有更新
// let art = {message:'first',id:"4"}
// this.$set(this.items,0,art) //$set 可以触发更新视图
},
methods: {
handClick(){
let change = this.items[0] change.message="shen"
this.$set(this.items,0,change)
}
}
}
</script>
<style>
</style>
调用方法调用方法: Vue.set( target , key , value)
target: 要更改的数据源(可以是一个对象或者数组)
key 要更改的具体数据 (索引)
value 重新赋的值
weixin_38626080
- 粉丝: 8
- 资源: 973
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- 珍藏多年的基于matlab实现潮流计算程序源代码集合,包含多个潮流计算程序.rar
- 使用FPGA实现串-并型乘法器
- 基于matlab实现针对基于双曲线定位的DV-Hop算法中误差误差出一种基于加权双曲线定位的DV-Hop改进算法.rar
- 基于matlab实现由遗传算法开发的整数规划,车辆调度问题.rar
- 电视家7.0(对电视配置要求高).apk
- 免费计算机毕业设计-基于JavaEE的医院病历管理系统设计与实现(包含论文+源码)
- 手机端 我的世界融合植物大战僵尸版.apk
- 植物大战僵尸 · 戴夫的老年生活 手机版.apk
- Runcraft · 我的世界跑酷游戏 手机端.apk
- pta题库答案c语言.docx
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功
评论0