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

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

對(duì)原始狀態(tài)的更改副本做出反應(yīng)狀態(tài)更改?

對(duì)原始狀態(tài)的更改副本做出反應(yīng)狀態(tài)更改?

holdtom 2023-07-20 17:25:13
我正在嘗試使用 React 制作一個(gè)簡單的游戲,例如紫色宮殿游戲中的紫色對(duì)。我有一個(gè)名為 的方法clickBtn,它應(yīng)該在單擊時(shí)增加計(jì)數(shù)并在第二次單擊時(shí)減少,但我不知道為什么該handleClick方法會(huì)更改chosen以及clicked狀態(tài)屬性,即使在不使用方法的情況下制作了新狀態(tài)的副本setState。你能幫我解決這個(gè)問題嗎?class GameBoard extends React.Component {  constructor() {    super();    this.state = {      score: 0,      time: 0,      list: [...generateObList(), ...generateObList()],      count: 0    };  }  handleClick = (id) => {    this.clickBtn(id);    const list = this.state.list.slice();    const current = list.find((a) => a.id === id);    for (let x of list) {      if (x.clicked && x.value == list.find((a) => a.id == id).value) {        x.chosen = true;        x.clicked = false;        current.chosen = true;        current.clicked = false;        // this.setState((prev) => ({        //   list: prev.list.map((el) =>        //     el.id === id ? current : el.value === current.value ? x : el        //   ),        //   score: prev.score + 1        // }));      }    }  };  clickBtn = (id) => {    const current = this.state.list.slice().find((e) => e.id === id);    let deClick = current.clicked;    current.clicked = !current.clicked;    console.log(current);    this.setState(      (prev) => ({        list: prev.list.map((el) => (el.id === id ? current : el)),        count: prev.count + (deClick ? -1 : 1)      }),      () => {        console.log(this.state.count, deClick, current);      }    );  };  render() {    const boardStyle = {      gridTemplateColumns: `repeat(5, 1fr)`,      gridTemplateRows: `repeat(5,1r)`    };    let list = this.state.list.map((n) => (      <Card        value={n.value}        onClick={(e) => {          this.handleClick(n.id);        }}        show={!n.chosen}      />    ));    return (      <div class="gameBoard" style={boardStyle}>        {list}      </div>    );  }}
查看完整描述

1 回答

?
斯蒂芬大帝

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

slice()只需返回?cái)?shù)組的淺表副本,因此如果項(xiàng)目是引用類型(對(duì)象),則原始和副本都引用相同的數(shù)組項(xiàng)目。

對(duì)于對(duì)象切片,將對(duì)象引用復(fù)制到新數(shù)組中。原始數(shù)組和新數(shù)組都引用同一個(gè)對(duì)象。如果對(duì)象發(fā)生更改,則新數(shù)組和原始數(shù)組都可以看到這些更改。

嘗試深度復(fù)制對(duì)象。您可以使用以下方法輕松進(jìn)行深度復(fù)制:JSON.parse(JSON.stringify(arr))

也可以試試lodashcloneDeep()方法。

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

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號(hào)

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