vue this.$forceUpdate()方法

当你修改了数据，但由于 Vue 响应式机制的限制（比如直接修改数组下标、对象新增属性），视图没有自动更新时，this.$forceUpdate()可以强制触发组件的render函数，让视图同步最新的数据。

不同场景下的使用方式

1. uni-app/Vue2 开发微信小程序（最常用）

在 Vue2 的选项式 API 中，直接通过this调用即可

2. uni-app/Vue3 开发微信小程序

Vue3 的setup语法中没有this，需要通过getCurrentInstance获取组件实例，或优先使用 Vue3 的响应式 API（推荐）

<template>
  <view>{{ list[0] }}</view>
  <button @click="updateArray">修改数组下标但视图未更新</button>
</template>

<script setup>
import { ref, getCurrentInstance } from 'vue';

const list = ref([1, 2, 3]);
// 获取Vue3组件实例（替代this）
const instance = getCurrentInstance();

const updateArray = () => {
  // 问题：直接修改数组下标，虽然数据变了，但视图可能未更新（Vue3已优化，但极端场景仍可能出现）
  list.value[0] = 100;
  
  // 方式1：推荐——用Vue3的响应式方式修改（优先选这个，而非强制更新）
  // list.value = [...list.value]; // 解构重构数组，触发响应式
  
  // 方式2：强制更新（仅兜底使用）
  instance.proxy.$forceUpdate();
};
</script>