uView弹窗里显示的数据没有及时更新怎么办？

设计师怡轩提问于 2026-02-05 22:38:28 阅读 25

移动

在uni-app里用uView的弹窗，弹窗里显示的变量在关闭后再次打开时还是之前的值，比如这样写：


methods: {
  openDialog() {
    this.message = '新内容'; // 这里每次点击都重新赋值
    this.$u.modal(this.message, {
      title: '提示'
    });
  }
}

明明每次点击按钮前我都重新设置了message值，但第二次打开弹窗还是显示第一次的内容。试过在mounted里初始化、用computed属性都没用，是什么原因导致数据不同步啊？

uni-app

我来解答赞 4 收藏

反馈

2 条解答

Top丶燕丽 Lv1

你这个是uView的modal用法有问题。官方文档里modal的参数是直接传字符串进去的，this.message虽然是响应式的，但modal内部不会监听它的变化。你在openDialog里改this.message其实没用，弹窗显示的是第一次传进去的值。

应该每次调用的时候直接把最新的值传到modal方法里，比如改成：

openDialog() {

  this.message = '新内容';

  this.$u.modal({

    content: this.message,

    title: '提示'

  });

}

这样每次调用openDialog都会把最新的message传进去。问题就出在原本写法里uView没有绑定content属性，导致弹窗内容没更新。我之前也踩过这个坑，uView的文档有时候参数写得不够明确。

2026-02-06 14:12

Good“东硕 Lv1

uView的modal是单例模式，第二次调用的时候组件不会重新渲染。省事的话直接加个key扰动：

openDialog() {

  this.message = '新内容' + Math.random();

  this.$u.modal(this.message, {

    title: '提示'

  });

}

2026-02-05 23:00