JavaScript狀態數據

来源:https://www.cnblogs.com/s0611163/p/18260757
-Advertisement-
Play Games

最近需要做一個三維場景切換的功能,切換場景後,還可以進行二三維模式的切換,二三維切換時,要定位到當前場景視角,那麼場景的視角參數信息就需要保存到狀態數據中,以供二三維場景切換時使用。 項目是用vue做的,這裡並沒有使用vue的狀態管理庫,我是這樣實現的: 定義狀態數據sceneInfo let sc ...


最近需要做一個三維場景切換的功能,切換場景後,還可以進行二三維模式的切換,二三維切換時,要定位到當前場景視角,那麼場景的視角參數信息就需要保存到狀態數據中,以供二三維場景切換時使用。
項目是用vue做的,這裡並沒有使用vue的狀態管理庫,我是這樣實現的:

  1. 定義狀態數據sceneInfo
let sceneInfo;
  1. 定義get、set方法
function getSceneInfo() {
    return sceneInfo;
}

function setSceneInfo(value) {
    sceneInfo = value;
}
  1. 導出get、set方法
export { 其它方法..., getSceneInfo, setSceneInfo }
  1. 使用時引入get、set方法
import { getSceneInfo, setSceneInfo } from "@/views/three/js/index.js";
  1. 保存狀態數據
setSceneInfo(sceneInfo);
  1. 讀取狀態數據
let sceneInfo = getSceneInfo();

通過以上方法,實現了三維場景切換後,切換二三維模式並定位的功能。您覺得這種方法如何?


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 前言 v-bind指令想必大家都不陌生,並且都知道他支持各種寫法,比如<div v-bind:title="title">、<div :title="title">、<div :title>(vue3.4中引入的新的寫法)。這三種寫法的作用都是一樣的,將title變數綁定到div標簽的title屬性 ...
  • RFC規範並沒有指明HTTP協議的GET方法是否不能攜帶body數據,但是對於瀏覽器環境下的XHR和fetch API的規範來說,它們的規範限制了它們不能在GET中攜帶body,而postman或apifox等介面測試工具則由於不遵循這些規範而可以攜帶body。 ...
  • 摘要:“本文深入探討了Nuxt3 Composables,重點介紹了其目錄架構和內置API的高效應用。通過學習本文,讀者將能夠更好地理解和利用Nuxt3 Composables來構建高效的應用程式。” ...
  • 依賴分類 依賴根據開發環境需要和實際運行環境需要,分為dependencies和devDependencies。 例如:typescript和eslint屬於devDependencies,而vue和axios等屬於dependencies。 版本號組成 版本由兩部分組成,一是前面的首碼符號,二是版 ...
  • 摘要:該文指南詳述了Nuxt 3的概況與安裝,聚焦於在Nuxt 3框架下運用Vuex進行高效的狀態管理,涵蓋基礎配置、模塊化實踐至高階策略,助力開發者構建高性能前後端分離應用。 ...
  • ‍ 寫在開頭 點贊 + 收藏 學會 如何解決uniapp H5本地代理實現跨域訪問? 1.第一種解決方法: 直接創建一個vue.config.js文件,併在裡面配置devServer,直接上代碼,重啟跑項目 親測有效 // vue.config.js module.exports ...
  • 很久很久沒有更新博客了,因為實在是太忙了,每天都有公司的事情忙不完....... 最近在做車輛模擬地圖,在實現控制站點名稱按需顯示時,折騰了好一段時間,特此記錄一下。最終界面如下圖所示: 站點顯示需求:首末站必須顯示,從第一個站開始,如果站點名稱能顯示下,則顯示,如果站點名稱會重疊則隱藏,以此類推。 ...
  • 摘要:本文是一份關於Nuxt 3路由系統的詳盡指南。它從介紹Nuxt 3的基本概念開始,包括Nuxt 3與Nuxt 2的區別和選擇Nuxt 3的理由。然後,它詳細解釋了安裝和配置Nuxt 3的步驟,以及Nuxt 3路由系統的基礎知識,如動態路由和嵌套路由。接著,它介紹了路由中間件的作用和編寫自定義中... ...
一周排行
    -Advertisement-
    Play Games
  • 前言 推薦一款基於.NET 8、WPF、Prism.DryIoc、MVVM設計模式、Blazor以及MySQL資料庫構建的企業級工作流系統的WPF客戶端框架-AIStudio.Wpf.AClient 6.0。 項目介紹 框架採用了 Prism 框架來實現 MVVM 模式,不僅簡化了 MVVM 的典型 ...
  • 先看一下效果吧: 我們直接通過改造一下原版的TreeView來實現上面這個效果 我們先創建一個普通的TreeView 代碼很簡單: <TreeView> <TreeViewItem Header="人事部"/> <TreeViewItem Header="技術部"> <TreeViewItem He ...
  • 1. 生成式 AI 簡介 https://imp.i384100.net/LXYmq3 2. Python 語言 https://imp.i384100.net/5gmXXo 3. 統計和 R https://youtu.be/ANMuuq502rE?si=hw9GT6JVzMhRvBbF 4. 數 ...
  • 本文為大家介紹下.NET解壓/壓縮zip文件。雖然解壓縮不是啥核心技術,但壓縮性能以及進度處理還是需要關註下,針對使用較多的zip開源組件驗證,給大家提供個技術選型參考 之前在《.NET WebSocket高併發通信阻塞問題 - 唐宋元明清2188 - 博客園 (cnblogs.com)》講過,團隊 ...
  • 之前寫過兩篇關於Roslyn源生成器生成源代碼的用例,今天使用Roslyn的代碼修複器CodeFixProvider實現一個cs文件頭部註釋的功能, 代碼修複器會同時涉及到CodeFixProvider和DiagnosticAnalyzer, 實現FileHeaderAnalyzer 首先我們知道修 ...
  • 在軟體行業,經常會聽到一句話“文不如表,表不如圖”說明瞭圖形在軟體應用中的重要性。同樣在WPF開發中,為了程式美觀或者業務需要,經常會用到各種個樣的圖形。今天以一些簡單的小例子,簡述WPF開發中幾何圖形(Geometry)相關內容,僅供學習分享使用,如有不足之處,還請指正。 ...
  • 在 C# 中使用 RabbitMQ 通過簡訊發送重置後的密碼到用戶的手機號上,你可以按照以下步驟進行 1.安裝 RabbitMQ 客戶端庫 首先,確保你已經安裝了 RabbitMQ 客戶端庫。你可以通過 NuGet 包管理器來安裝: dotnet add package RabbitMQ.Clien ...
  • 1.下載 Protocol Buffers 編譯器(protoc) 前往 Protocol Buffers GitHub Releases 頁面。在 "Assets" 下找到適合您系統的壓縮文件,通常為 protoc-{version}-win32.zip 或 protoc-{version}-wi ...
  • 簡介 在現代微服務架構中,服務發現(Service Discovery)是一項關鍵功能。它允許微服務動態地找到彼此,而無需依賴硬編碼的地址。以前如果你搜 .NET Service Discovery,大概率會搜到一大堆 Eureka,Consul 等的文章。現在微軟為我們帶來了一個官方的包:Micr ...
  • ZY樹洞 前言 ZY樹洞是一個基於.NET Core開發的簡單的評論系統,主要用於大家分享自己心中的感悟、經驗、心得、想法等。 好了,不賣關子了,這個項目其實是上班無聊的時候寫的,為什麼要寫這個項目呢?因為我單純的想吐槽一下工作中的不滿而已。 項目介紹 項目很簡單,主要功能就是提供一個簡單的評論系統 ...