vue中使用Object.assign导致视图不响应
可以正常响应的
<template>
<div>
<ul>
<li class="li-item" v-for="(item,index) in list" :key="index" @click="hander(item)">
{{item}}
</li>
</ul>
</div>
</template>
<script>
export default {
data(){
return{
list:[]
}
},
created(){
setTimeout(()=>{
let arr=[
{ name:'张三1',flag:true},
{ name:'张三2',flag:true},
{ name:'张三3',flag:true},
{ name:'张三4',flag:true},
]
let newList=[];
for(let i=0;i<arr.length;i++){
let item=arr[i];
console.log(item)
let a=Object.assign(item,{'select':true});
newList.push(a)
}
this.list=newList;
},300)
},
methods:{
hander(mess){
for(let i=0;i<this.list.length;i++){
if(mess.name==this.list[i].name){
this.list[i].select=! mess.select;
}
}
},
},
}
</script>
<style scoped>
.li-item{
height: 40px;
background: #c0c0cc;
line-height: 40px;
margin-bottom: 10px;
}
</style>
不会正常的响应
今天太晚了,明天我在写一写;休息一会
vue中使用Object.assign导致视图不响应的更多相关文章
- vue中修改了数据但视图无法更新的情况[转载]
我们有时候常碰到vue中明明修改了数据,但是视图无法更新,因此我总结了一点点碰到此类的情况: 1.v-for遍历的数组,当数组内容使用的是arr[0].xx =xx更改数据,vue无法监测到 数组数据 ...
- js中的Object.assign接受两个函数为参数的时候会发生什么?
缘由 今天看到一段代码 return Object.assign(func1, func2); 心生疑惑,为什么 Object.assign 的参数可以是函数? 于是有了下面这一堆东西,其实都是老生常 ...
- es6中的Object.assign
在写一些插件的时候,我们会经常遇到所传参数需要合并默认参数,并覆盖相同参数的情况,在jQuery中我们可以使用$.extend(),在原生中要想使用得自己封装, 但自从es6出现了Object.ass ...
- vue中使用axios与axios的请求响应拦截
VUE中使用Axios axios的安装 npm install axios vue-axios axios在vue的配置与使用 在main.js中引入axios和vue-axios import a ...
- vue中修改了数据但视图无法更新的情况
数组数据变动:我们使用某些方法操作数组,变动数据时,有些方法无法被vue监测,有些可以 Vue包装了数个数组操作函数,使用这些方法操作的数组去,其数据变动时会被vue监测: push() pop() ...
- 011——VUE中使用object与array控制class
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- vue中改变数组的值视图无变化
今天开发的时候遇到一个多选取消点击状态的,渲染的时候先默认都选中,然后可以取消选中,自建了一个全为true的数组,点击时对应下标的arr[index]改为false,数据改变了状态没更新,突然想起来单 ...
- vue 中的router 配置问题 导致的内存溢出~~~
最近的项目用到 vue, 各种踩坑中. 其中一个就是router映射表写的稍有不慎,就会出现内存溢出的问题, 而且也不会具体告诉你哪里出错,所以很是头疼~~~ 出错多了,发现了一些router的一些规 ...
- vue中修改了数据但视图无法更新的情况(转)
原文地址:https://blog.csdn.net/qq_39985511/article/details/79778806
- es6 javascript对象方法Object.assign()
es6 javascript对象方法Object.assign() 2016年12月01日 16:42:34 阅读数:38583 1 基本用法 Object.assign方法用于对象的合并,将源对象 ...
随机推荐
- React Native 打包 App 发布 iOS 及加固混淆过程
React Native 打包 App 发布 iOS 及加固混淆过程 摘要 本文将介绍如何使用 React Native 打包并发布 iOS 应用到 App Store,并介绍了如何进行应用的加固和混 ...
- SpringBoot java 一个接口,多个实现,客户定制化
产品定制化时,在不同的客户中会有不同的需求,这时候会产生,一个接口,多个实现 SpringBoot ,如果发现有多实现时,会报如下错误 Consider marking one of the bean ...
- SpringBoot Jar 包太大 瘦身 【初试】
SpringBoot Jar 包太大 瘦身,建议使用时,参考: SpringBoot Jar 包太大 瘦身 [终极版] 29M, 排除少量JAR包方式 打包,排除指定jar 包 <build&g ...
- 【主流技术】聊一聊 Redis 的基本结构和简单应用(一)
目录 前言 一.String 类型 二.List 类型 三.Hash 类型 四.Set 结构 五.Sort Set (Zset)结构 六.文章小结 前言 Redis 是目前互联网后端的热门中间件之一, ...
- 2021 年如何学习 Android,一位 5 年中大厂老哥跟你聊聊
本文首发我的微信公众号:程序员徐公 大家好,我是程序员徐公,加上实习,有五年中大厂经验.今天,我们一起来聊一聊如何自学 Android. 光阴似箭,日月如梭,时间真的过得飞快. 加上实习,从事 And ...
- RabbitMQ--工作模式
单一模式 即单机不做集群 普通模式 即默认模式,对于消息队列载体,消息实体只存在某个节点中,每个节点仅有 相同的元数据,即队列的结构 当消息进入A节点的消息队列载体后,消费 者从B节点消费时,rabb ...
- Java 键值对数据本地保存与读取
代码: package com.sux.demo.utils; import com.alibaba.fastjson.JSONObject; import java.io.File; import ...
- 使用acme.sh、acme-dns自动申请ssl证书
使用acme.acme-dns实现自动申请ssl证书并实现自动替换 有些dns没有dnsapi,所以用这种方式申请只需要添加一条dns解析即可完成 以下为linux系统操作 安装acme.sh 官方源 ...
- 如何在 Debian 12 上安装 MariaDB
MariaDB 是一个开源多线程的关系数据库管理系统,是 MySQL 的替代品. MariaDB 是 Debian 中 MySQL 的默认替换方案. 本教程介绍如何在 Debian 12 上安装 Ma ...
- uni-app 预览pdf文件
安卓uni-app实现pdf文件预览功能: 1.https://mozilla.github.io/pdf.js/getting_started/#download下载 放在根目录下, 2.新建一个w ...