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

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

是否可以使此刪除按鈕和輸入表單起作用?

是否可以使此刪除按鈕和輸入表單起作用?

慕娘9325324 2022-12-09 15:25:21
所以 iv 現(xiàn)在被卡住了很長(zhǎng)一段時(shí)間,我需要讓我的刪除按鈕在每一行上都起作用,并讓輸入將信息吐到我的表中。我的問(wèn)題是:甚至有可能做到嗎?(我今天才開(kāi)始從字面上學(xué)習(xí)react/js)。最終產(chǎn)品應(yīng)該看起來(lái)像“待辦事項(xiàng)列表”,但當(dāng)我打開(kāi)它時(shí),它會(huì)自動(dòng)具有來(lái)自 api 的值,我可以刪除和添加新的值。我的代碼: export default class FetchRandomUser extends React.Component {  state = {    loading: true,    people: []  };  async componentDidMount() {    const url = "https://swapi.dev/api/people/";    const response = await fetch(url);    const data = await response.json();    const pirmadata = data;    this.setState({ people: pirmadata.results, loading: false });   console.log(pirmadata)  }  render() {    if (this.state.loading) {      return <div>loading...</div>;    }    if (!this.state.people.length) {      return <div>didn't get a person</div>;    }    return (      <div className="listas">        {this.state.people.map(person => (          <tr className="taras" key={person.name + person.age}>            <th className="name">{person.name}</th>            <th className="birth">{person.birth_year}</th>            <th className="genders">{person.gender}</th>            <th><button type="submit" className="delete">Delete</button></th>          </tr>        ))}      </div>    );  }}我的表單是在不同的 .js 文件上制作的,基本上是一個(gè)包含此表單的函數(shù):<div className="forma">    <form>        <input type="text" placeholder="Enter name :"></input>        <input type="text" placeholder="Enter birth date :"></input>        <input type="text" placeholder="Enter gender :"></input>        <button type="submit">Submit entry!</button>        </form></div>
查看完整描述

1 回答

?
白衣非少年

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

click為作為元素onSubmit處理程序的刪除按鈕添加一個(gè)處理程序form。這樣當(dāng)您單擊它時(shí),它將調(diào)用表單的處理函數(shù)。


將 th 元素作為 prop傳遞handlerFunc給組件,以便能夠按以下方式使用它:


function YourComponent({ handler }){    

    return <th><button onClick={handler} className="delete">Delete</button></th>);

}

表單 onSubmit 句柄:


<form onSubmit={handlerFunc}>

        <input type="text" placeholder="Enter name :"></input>

        <input type="text" placeholder="Enter birth date :"></input>

        <input type="text" placeholder="Enter gender :"></input>

        <button type="submit">Submit entry!</button>

</form>

<YourComponent handler={handlerFunc} />


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

添加回答

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