vue3设置全局变量并获取 全局响应式变量 窗口大小

设置

js文件统一管理全局变量

方法1 app provide() 全局提供变量

通过inject()使用

方法2

app实例配置全局变量

获取 通过 getCurrentInstance.appContext.config.globalProperties.$innerWidth访问到

code

import { ref } from 'vue'
export const useGlobalState = () => {
  const innerWidth = ref(window.innerWidth)
  window.addEventListener('resize', () => {
    innerWidth.value = window.innerWidth
  })
  return { innerWidth }
}

相关推荐

  1. Vue3使用Pinia获取全局状态变量

    2024-06-08 12:22:05       28 阅读
  2. scss for循环,$全局样式

    2024-06-08 12:22:05       23 阅读
  3. vue3中集成sass实现全局scss样式变量

    2024-06-08 12:22:05       34 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-06-08 12:22:05       17 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-06-08 12:22:05       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-06-08 12:22:05       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-06-08 12:22:05       18 阅读

热门阅读

  1. Vue Router——hash模式和 history模式

    2024-06-08 12:22:05       10 阅读
  2. Elasticsearch 认证模拟题 - 10

    2024-06-08 12:22:05       10 阅读
  3. TCP和udp能使用同一个端口通讯吗

    2024-06-08 12:22:05       8 阅读
  4. 设计模式总结

    2024-06-08 12:22:05       6 阅读
  5. UVa1116/LA2429 Puzzle

    2024-06-08 12:22:05       5 阅读
  6. #07 使用Stable Diffusion生成高质量图片的技巧

    2024-06-08 12:22:05       8 阅读
  7. HTTP参数污染漏洞

    2024-06-08 12:22:05       8 阅读