第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何在本地存儲(chǔ)中保存“游戲狀態(tài)”?

如何在本地存儲(chǔ)中保存“游戲狀態(tài)”?

慕俠2389804 2023-04-14 16:28:15
我正在編寫(xiě)一個(gè)非常簡(jiǎn)單的風(fēng)險(xiǎn)游戲,每當(dāng)你點(diǎn)擊一個(gè)國(guó)家時(shí),它的顏色就會(huì)從紅色變?yōu)榫G色、黃色、紫色,然后再變?yōu)榘咨D銖囊粡垺叭住钡貓D開(kāi)始,我想做的是創(chuàng)建不同的插槽,讓我可以說(shuō)一旦我給一些地圖上色,將游戲保存在那個(gè)插槽中,然后重新加載插槽號(hào) 1 例如和繼續(xù)我離開(kāi)的地方。對(duì)于 4 個(gè)不同的插槽,我怎么能做到這一點(diǎn)?世界地圖是一個(gè) SVG 文件,我將每個(gè)區(qū)域的顏色更改為event.target.style.fill.拿這個(gè)代碼:HTML    <svg   width="100%" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"                viewBox="0 0 701 300" style="enable-background:new 0 0 701 300;" xml:space="preserve">          <g onclick="changeColor(event)">       <path class="st1" d="M308.6,112.3l-0.1,0.2l-0.1,0.2l-0.1-0.1h-0.1l-0.1-0.1l0.1-0.1h0.1l0.1-0.1l0.1-0.1L308.6,112.3L308.6,112.3z            M313.4,111.6v0.2l0.1,0.1l-0.1,0.2v0.1l-0.1,0.1l-0.2,0.1l-0.1,0.1l-0.2-0.1l-0.2-0.2l-0.1-0.1v-0.2l0.2-0.1v-0.2v-0.1h0.2h0.1h0.1           L313.4,111.6z M309.9,111.8L309.9,111.8l-0.2-0.1l-0.1-0.1v-0.1v-0.1h0.1h0.1l0.2,0.1v0.1L309.9,111.8L309.9,111.8z M312,110.6           L312,110.6l-0.2,0.2l-0.1,0.2l-0.1,0.1v0.1l-0.1,0.2v0.1l-0.2,0.2v0.1h-0.1l-0.2,0.1l0,0v-0.1l-0.1-0.1v-0.1l-0.1-0.1v-0.1l-0.1-0.2           l0.2-0.1l0.1,0.1l0.2-0.1h0.1l0.2-0.1l0.2-0.1v-0.1l0.2-0.1h0.2L312,110.6L312,110.6z M315.6,111.6l-0.1,0.1h-0.1h-0.1h-0.1v-0.1           h0.1l0.2-0.1l0.1-0.1l0.1-0.1v-0.2V111l0.1-0.2l0.1-0.1l0.1-0.2l0.1-0.3l0.1-0.1h0.1l0.1,0.1v0.2v0.2v0.2v0.2l0,0l-0.1,0.2l-0.1,0.1           H316L315.6,111.6L315.6,111.6z M308.8,110h0.1l0.1,0.1l0.1,0.2l-0.1,0.1v0.1l-0.2,0.3l0,0v-0.1l-0.1-0.3v-0.1v-0.1L308.8,110h0.1           H308.8z M317.1,109.3L317.1,109.3l-0.1,0.3l-0.2,0.2h-0.2l-0.1,0.2l-0.2-0.1l0,0l0.1-0.1v-0.1l0.1-0.1l0.1-0.1h0.1l0.1-0.1h0.2l0,0           L317.1,109.3l0.1-0.1l0.1,0.1H317.1z"/></g></svg>CSS(初始顏色 = 白色).st1{fill:#FFFFFF;stroke:#000000;stroke-linejoin:round;}這是現(xiàn)場(chǎng)演示和網(wǎng)站,您可以查看。我添加的最后一件事是用于保存和加載游戲的 UI。(可以在“加載/保存游戲”按鈕上找到。https://risk-git-saves-system.swilkery.vercel.app/
查看完整描述

1 回答

?
呼啦一陣風(fēng)

TA貢獻(xiàn)1802條經(jīng)驗(yàn) 獲得超6個(gè)贊

為了使用 localStorage 保存應(yīng)用程序的狀態(tài),您需要?jiǎng)?chuàng)建如下函數(shù):


function save(slotIndex, clicks) {

  let slots;


  try {

    slots = JSON.parse(localStorage.getItem('slots'));

  } catch (e) {

    console.error(e);

  }


  if (!slots) {

    slots = [0, 0, 0, 0];

  }


  slots[slotIndex] = clicks;


  localStorage.setItem('slots', JSON.stringify(slots));

}


function restore(slotIndex) {

  let slots = [];


  try {

    slots = JSON.parse(localStorage.getItem('slots'));

  } catch (e) {

    alert('no slots found in local storage');

  }


  return slots[slotIndex] || 0;

}

這里有一個(gè)應(yīng)用程序的版本,其中包含我的更改。


需要注意的是,我們保存的狀態(tài)只是已發(fā)生的點(diǎn)擊次數(shù),這對(duì)應(yīng)于將用于在一個(gè)國(guó)家著色的下一個(gè)顏色。


我懷疑你真正想要保存的是國(guó)家本身的顏色。


這將需要更復(fù)雜的數(shù)據(jù)結(jié)構(gòu):


const slots = [

  

  {

    currentColorIndex: 2,

    selectedCountries: [

       { id: 'spain', colorIndex: 3 },

       { id: 'usa', colorIndex: 1 },

    ]

  },

  ... other slots

  

];

只要將其字符串化(localStorage 中的所有值都必須是字符串),這也可以存儲(chǔ)在 localStorage 中。在您的應(yīng)用程序中,每當(dāng)您更改 SVG 中的顏色時(shí),您都需要更新此結(jié)構(gòu),以確保它們彼此保持同步。


這是應(yīng)用程序開(kāi)始變得復(fù)雜的地方,我建議查看類似 MVC(模型視圖控制器)模式的內(nèi)容,以了解開(kāi)發(fā)人員通常如何處理此問(wèn)題。


查看完整回答
反對(duì) 回復(fù) 2023-04-14
  • 1 回答
  • 0 關(guān)注
  • 149 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)