vue如何实现实时数据回显?

2021-02-23 15:47发布

添加了一条评论,如何做到添加后马上添加到评论列表展示?还要重新调用显示列表的接口吗?还是说还有什么办法可以做到直接回显?

添加了一条评论,如何做到添加后马上添加到评论列表展示?还要重新调用显示列表的接口吗?还是说还有什么办法可以做到直接回显?

6条回答
樱田妮妮NiNi
2楼-- · 2021-02-24 09:37

body {

  1.    background: #fff;

  2.    color: #333;

  3.    font-family: "PingFang SC","Lantinghei SC","Microsoft YaHei",arial;

}body {

  1.    background: #FFF;

  2.    color: #333;

  3.    font: 12px/1.5 'Microsoft Yahei',arial,sans-serif;

  4.    text-align: center;

}
}


浅浅77
3楼-- · 2021-02-24 09:48

正常情况下是要重新请求接口,但是你可以在提交评论成功后,把当前的评论加在之前获取的json字符串后面,但是如果之间有别人评论了就没法实时获取

aijingda
4楼-- · 2021-02-24 14:14

vue数据回显

       最近在修改别人的一个bug,数据回显效果出不来的bug。开始的时候没头绪,经过百度一脑子查询和本地调试,终于解决。我用到vue的this.$set()来进行强制更新实现的,但是有一点需要注意的,

对象操作的方法:三个参数:this.$set("改变的对象","改变的对象属性","值")

数组操作的方法: 三个参数:this.$set("数组","下标","值")

下面是实现的具体代码

 
let _this = this;
_this.formulaOperation.formulaOperationSkus.forEach((item,index) =>{
if(item.surrogateSkuId == row.id) {
    _this.$set(item,item.surrogateName,_this.row.surrogateName)
}
})

formulaOperationSkus是一个对象

_this.$set(item,item.surrogateName,_this.row.surrogateName)

这行代码是关键,一定要对应上面的操作方法。

这样一来input就可以实现数据回显问题了。

希望能帮到遇到同样问题的你们,也希望能有大牛在下方进行指点迷津。

vue数据回显

       最近在修改别人的一个bug,数据回显效果出不来的bug。开始的时候没头绪,经过百度一脑子查询和本地调试,终于解决。我用到vue的this.$set()来进行强制更新实现的,但是有一点需要注意的,

对象操作的方法:三个参数:this.$set("改变的对象","改变的对象属性","值")

数组操作的方法: 三个参数:this.$set("数组","下标","值")

下面是实现的具体代码

let _this = this;_this.formulaOperation.formulaOperationSkus.forEach((item,index) =>{if(item.surrogateSkuId == row.id) {_this.$set(item,item.surrogateName,_this.row.surrogateName)}})

formulaOperationSkus是一个对象

_this.$set(item,item.surrogateName,_this.row.surrogateName)

这行代码是关键,一定要对应上面的操作方法。

这样一来input就可以实现数据回显问题了。

希望能帮到遇到同样问题的你们,也希望能有大牛在下方进行指点迷津。


buzuofa100
6楼-- · 2021-02-24 18:50

正常情况下是要重新请求接口,但是你可以在提交评论成功后,把当前的评论加在之前获取的json字符串后面,但是如果之间有别人评论了就没法实时获取

天使的奶爸
7楼-- · 2021-02-25 10:21

body {

  1.    background: #fff;

  2.    color: #333;

  3.    font-family: "PingFang SC","Lantinghei SC","Microsoft YaHei",arial;

}body {

  1.    background: #FFF;

  2.    color: #333;

  3.    font: 12px/1.5 'Microsoft Yahei',arial,sans-serif;

  4.    text-align: center;