zoukankan      html  css  js  c++  java
  • 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>
    

    不会正常的响应

    今天太晚了,明天我在写一写;休息一会
    
    作者:明月人倚楼
    出处:https://www.cnblogs.com/IwishIcould/

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,或者关注博主,在此感谢!

    万水千山总是情,打赏5毛买辣条行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主(っ•̀ω•́)っ✎⁾⁾!

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    支付宝
    微信
    本文版权归作者所有,欢迎转载,未经作者同意须保留此段声明,在文章页面明显位置给出原文连接
    如果文中有什么错误,欢迎指出。以免更多的人被误导。
  • 相关阅读:
    Flush the AOS cache from code
    EntityConnectionStringBuilder 构造EF连接字符串
    AX中文转拼音
    AX2012 AOT中Web部署显示二级以上菜单
    clearCompanyCache
    AX2009 打印到PDF优化
    AX ODBC读取其他SQL数据库服务器数据
    AX2009报表打印固定长度Barcode条码
    Create Product Variant
    Rename AOT Object
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/14778989.html
Copyright © 2011-2022 走看看