vue新增时表单里有数据,vue 数组数据增加 页面不更新

　　本文主要介绍vue如何及时添加数组页面显示，有很好的参考价值。希望对大家有帮助。如有错误或不足之处，请不吝赐教。

目录

　　如何添加数组页面并及时显示给对象添加数组

如何添加数组页面及时显示

　　最近一直在做vue相关的项目，在这个过程中遇到了很多问题，有些已经解决了，有些还没有解决。比较好的一个问题是，一个评论回复功能，通过点击回复，可以获取内容并添加到数组中，但是页面不会及时显示。

　　百度了很多摸索，终于解决了。

　　我们一起来看看吧。

　　//newwrite是定义的数组。

　　//推入用户名和输入内容，changeitems

　　//changeitems是我正在监听的输入框的内容。

　　//textarea id= reply _ text cols= 30 rows= 10 v-model= change items /textarea

　　//

　　this.newwrite.push({

　　user_id:this.userid，

　　请求内容：更改项目

　　})

　　console . log(this . new write)；

　　因为我有些地方用的是二维数组，这种推送方式无法及时显示在页面上。

　　Js代码：

　　//这是一个二维数组的项

　　//多条评论下的回复

　　//单击添加到相应的注释

　　_this.items[index]。推({

　　用户名：_this.username

　　user_id:_this.userid，

　　请求内容：文本

　　})

　　Html代码：

　　items[index]中的div v-for=(item，indexss):key= indexss

　　span class= my _ comment name { username } }:/span span class= my _ comment { item } }/span

　　/div

　　可以传入数组，但不能显示在页面上。

　　所以用另一种方法，vue.set (this.arr，this.arr.length，text)；

　　在这里，这应该预先定义结构。

　　Js代码：

　　//a=[]

　　//这里_这个=这个

　　_ this . items[I]=new Array()；

　　_ this . a . push(_ this . items[I])；

　　//点击事件：

　　Vue.set(this.a，this.a.length，text)；

　　Html代码：

　　！-

　　 div v-for=(item，indexss) in a :key=indexss

　　span class= my _ comment name { username } }:/span span class= my _ comment { item } }/span

　　/div

　　然后点击回复，就会及时显示在页面上。

给对象中添加数组

　　这个。$set(对象，键，数组)

　　例如：

　　这个。$set(this.modelForm， Authorizers ，this . choose data)；

　　以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。