uniapp修改代码后不刷新

前言：

uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架，可以方便地将代码编译为各种平台的原生代码。在开发过程中，有时我们会遇到修改代码后页面不自动刷新的问题。本文将从以下方面详细说明可能导致这个问题的原因和解决方法。

1. 缓存问题

在开发 uni-app 应用时，由于手机端和电脑浏览器都会对部分资源进行缓存，当我们修改代码后，浏览器或手机端可能仍然使用之前缓存的资源来加载页面，导致代码修改不生效。为了解决这个问题，我们可以通过以下几种方式来强制刷新页面：

// 通过修改链接地址参数来强制刷新页面
window.location.href = window.location.href + '?' + Math.random();
// 刷新页面
window.location.reload();

2. 跨域问题

另外一个导致页面不刷新的常见问题是跨域请求。当我们的 uni-app 项目与后端接口部署在不同的域名下时，浏览器可能会拦截跨域请求，导致不会触发页面刷新。为了解决这个问题，我们可以在前端服务配置中添加对应的跨域规则：

// 在项目根目录下的 vue.config.js 文件中添加如下配置
module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://api.example.com', // 后端接口的域名
        changeOrigin: true, // 开启跨域
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

3. HBuilderX 配置问题

如果你是在 HBuilderX 中开发 uni-app 项目，有时候可能会出现修改代码后页面不刷新的情况。这可能是因为 HBuilderX 在默认配置下启用了 Web 服务器的缓存机制，为了实时更新修改的代码，我们可以尝试修改 HBuilderX 的配置。具体做法如下：

1. 打开 HBuilderX -> 偏好设置 -> 通用 -> 打开一个控制台选项
2. 在弹出的控制台选项中，取消勾选“启用 Web 服务器缓存”
3. 点击确定保存设置并重启 HBuilderX

总结：

当我们在开发 uni-app 项目时，遇到代码修改后页面不刷新的问题，首先需要检查缓存、跨域和开发工具配置等方面的问题。根据具体情况采取适当的解决方法，可以有效解决这个问题。希望本文提供的解决方案对您有所帮助。