uniapp项目中，如何在vue页面中添加全局的 let that = this

在uniApp项目中，Vue组件默认提供`this`指向当前组件实例。如果你需要在某个Vue页面的函数或生命周期钩子中创建一个指向当前`this`的引用，并希望这个引用在整个函数内部有效，你可以使用箭头函数或者局部变量来保存`that`：

// 使用箭头函数
let that;
export default {
  methods: {
    someMethod() {
      that = this; // 将this赋值给that
      // 然后在这里可以使用that而不是this
      that.someProperty();
    }
  }
}

// 或者

data() {
  return {
    that: null, // 初始化为null
  };
},
methods: {
  someMethod() {
    this.$nextTick(() => { // 需要在DOM更新之后才能获取到正确的this
      this_that = this; // 给that赋值
      // ...然后继续使用that
    });
  }
}

注意，如果你在生命周期钩子如`mounted`、`updated`等内初始化`that`，确保它在异步操作（如`$nextTick`）完成后再赋值，因为`this`可能会在这些钩子回调执行前改变。

相关问题

使用vue2版开发uniapp项目，如何在vue页面中添加全局的 let that = this

在 Vue 2 版本的 UniApp 开发中，由于 UniApp 框架基于 TypeScript，所以在 Vue 组件内部通常不需要显式地声明 `let that = this`，因为 Vue 的实例属性会自动绑定到当前作用域。但是如果你想创建一个全局变量或在 Vue 中共享状态，你可以通过以下几种方式：

1. **Vue.prototype** 或者 **this.$parent**: 如果你想在整个组件树中访问当前实例，可以将它挂载到 Vue 的原型上，例如：

   Vue.prototype.$that = this;

2. **Vuex store**: 如果需要管理应用的状态，可以使用 Vuex 状态管理库，它提供了一种集中式的存储，所有组件都可以通过 actions 和 getters 访问。

3. **自定义指令**: 创建一个全局自定义指令，让每个组件能通过该指令获取 `this` 对象，但这不是最佳实践，因为它可能会导致全局污染。

4. **Component选项**: 在组件的选项对象中，你也可以考虑将 `methods` 属性暴露出来，并使用对象解构赋值的方式获取 `this`：

   export default {
     methods: {
       ...{
         someMethod() {
           // 这里 you 可以访问 this
           const you = { ...this };
           // ...
         }
       },
     }
   }

注意，在现代的 Vue.js 应用中，推荐使用 prop、事件以及Vuex 进行父子组件间的通信，而不是直接共享状态。