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

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

我在 React 中映射已創(chuàng)建的數(shù)組時(shí)遇到問題,并且正在嘗試傳播它(但無濟(jì)于事)

我在 React 中映射已創(chuàng)建的數(shù)組時(shí)遇到問題,并且正在嘗試傳播它(但無濟(jì)于事)

嚕嚕噠 2022-09-16 20:54:21
我在這里設(shè)置了一個(gè)系統(tǒng),單擊保存按鈕抓取一個(gè)div并制作一個(gè)可用的圖像文件。我知道這是有效的,因?yàn)槲乙呀?jīng)讓它與單個(gè)圖像一起工作。我現(xiàn)在已將其設(shè)置為與同一圖像的多個(gè)圖像一起使用,但我似乎無法讓它映射任何內(nèi)容。我一直在閱讀有關(guān)傳播的文章,我正在嘗試這樣做,但它仍然不適合我。我以前遇到過這種掙扎,如果有人能解釋為什么這不起作用,我會(huì)很高興。我正在使用反應(yīng)鉤子。我也知道狀態(tài)正在更新,據(jù)我所知是正確的。我大約99%確定問題出在映射中。import React, { useState } from "react";import "./Favorites.css";import htmlToImage from "html-to-image";import FileBase64 from "react-file-base64";function Favorites(props) {  const [files, setfiles] = useState([]);  const newspreadarray = [...files];  const getimage = () => {    var htmlToImage = require("html-to-image");    var node = document.getElementById("mymodal153");    htmlToImage      .toPng(document.getElementById("mymodal153"), { quality: 0.01 })      .then(function (dataUrl) {        var img = new Image();        img.src = dataUrl;        console.log(dataUrl);        let newarray = files;        newarray.push(dataUrl);        console.log(newarray);        setfiles(newarray);      })      .catch(function (error) {        console.error("oops, something went wrong!", error);      });  };  return (    <div>      <span onClick={getimage} className="minize close">        save &minus;      </span>      <div className="imageholder">        <div id="mymodal153">          <img src="https://i.imgur.com/LFXgB63.png" class="dinoimage" />          <h1>Cool</h1>          <p>hi this is some example text</p>        </div>        <div id="imageplacer"></div>        {newspreadarray.map((post, index) => (          //we can fiddle with sizes here :)          <img src={post} key={index} />        ))}      </div>    </div>  );}export default Favorites;
查看完整描述

1 回答

?
白衣染霜花

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

問題是你正在改變狀態(tài)。


.then(function (dataUrl) {

    var img = new Image();

    img.src = dataUrl;

    console.log(dataUrl);

    let newarray = files; // <-- reference to state

    newarray.push(dataUrl); // <-- mutation

    console.log(newarray); // <-- save same reference back to state

    setfiles(newarray);

})

或更簡(jiǎn)潔


setfiles([...files, dataUrl]);

您應(yīng)該創(chuàng)建一個(gè)新的數(shù)組引用


.then(function (dataUrl) {

    var img = new Image();

    img.src = dataUrl;

    console.log(dataUrl);

    const newarray = [...files]; // <-- spread existing state into new array

    newarray.push(dataUrl); // <-- append new element

    console.log(newarray);

    setfiles([...files, dataUrl]); // <-- save new reference to state

  })

這也是一條非常無用的線


const newspreadarray = [...files];

您可以簡(jiǎn)單地


{files.map((post, index) => (

  //we can fiddle with sizes here :)

  <img src={post} key={index} />

))}


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

添加回答

舉報(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)