账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue如何动态更新外部引用对象?
    76
    0
        function processData2(responseText) {
            var data = responseText;                         
            var docjson = data.List;        
            
            console.log("178: " + docjson[9].Title)        
        
            var vm = new Vue({
                el: '#docs',            
                data: {
                    docjson: docjson,
                },
                methods:{
                  showintro(infoId,infoType){
                     opennewpage(infoType + "intro.html?infoId=" + infoId, infoType + "intro", "slide-in-right", true, true);                    
                  },                  
                }
            });                                        
        }
    <-- html-->
    <div id="docs" class="mui-table-view mui-table-view-chevron list-atr">
                    <div  class="item-list"  v-for="(list,index) in docjson" :key="list.ImgUrl" v-on:click="showintro(list.DjLsh,'art')">                             
                        <div class="list-letf" >
                            <img :src="list.ImgUrl" class="list-img" />
                        </div>
                        <div class="list-right">
                            <div class="list-right-head">
                                <div class="list-title line-clamp1">{{list.Title}}</div> 
                                <div class="list-name">{{list.UserPenName}}</div>    
                            </div>                                    
                            <div class="list-intro line-clamp1">{{list.Intro}}</div>
                            <div class='list-tagNav'>
                                <div class="tag-text OrgColor">{{list.ViewNeedMoney *10  + "积分"}}</div>
                                <div class="tag-text" >{{list.ViewCount + "人观看"}}</div>
                                <div class="tag-text" >{{list.CommentCount + "人评论"}}</div>
                            </div>                                                                                                                                 
                        </div>                                                                            
                    </div>
                </div>
    
    

    第一次加载后data能够获取到docjson 的值,并渲染到列表当中。但是上拉加载后,虽然docjson 里的值更新了,可是列表并没有跟着更新,依然是显示的是上一次的数据,是因为docjson 动态更新后没有传入到data里吗?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • SSD 普通会员 1楼

      在 Vue 中,你可以使用 $set 方法来动态更新外部引用对象。$set 方法是 Vue 的一个重要的数据操作方法,用于设置对象的属性。

      例如,假设你有一个名为 user 的对象,它有一个名为 name 的属性。你可以使用 $set 方法来更新 name 的值:

      javascript user.name = "John Doe";

      如果你想更新的对象是一个数组,你可以使用 map 方法来遍历数组,然后使用 $set 方法来更新每个对象的属性:

      javascript user.map(item => item.name = "John Doe");

      在上面的示例中,user.map 方法会遍历 user 数组,然后对于每个对象,它会使用 $set 方法来更新 name 的值。

      需要注意的是,$set 方法不会直接修改原始对象,而是返回一个新的对象。如果你想修改原始对象,你需要使用 Object.assign 方法来合并新对象和原始对象:

      javascript let newUser = Object.assign({}, user, { name: "John Doe" });

      在上面的示例中,newUseruser 和一个新的 name 属性合并,然后返回一个新的对象。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部