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

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

我無法提交，因?yàn)樽x取了未定義的屬性“值”

我無法提交，因?yàn)樽x取了未定義的屬性“值”

呼啦一陣風(fēng) 2023-09-07 14:31:36
我有一個(gè)輸入和一個(gè)按鈕，它似乎無法檢測(cè)輸入的值。我沒有使用任何表單標(biāo)簽，我想知道這是否是原因。我在這里缺少什么？非常感謝并非常感謝。<div className="input-group mb-3">      <input type="text" className="form-control" placeholder="add a post"/>        <div class="input-group-append">              <button  type="submit" class="btn btn-primary" onClick={(e) => {              makePost(e.target[0].value, item._id)}} type="button">Post</button>         </div>                    </div>
查看完整描述

3 回答

?
侃侃無極

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

  1. e.target為您提供按鈕的參考，但在那里找不到表單的數(shù)據(jù)。

  2. 您有重復(fù)的 type 屬性，type="submit"并且type="button"type=submit 將提交表單，而 type=button 只是一個(gè)按鈕。

如果你不想使用 React 的狀態(tài)，你可能無論如何都應(yīng)該使用。https://reactjs.org/docs/hooks-state.html，您可以將輸入元素包裝在一個(gè)form元素中并附加onSubmit表單的處理程序。將按鈕的類型更改為submit（請(qǐng)記住添加preventDefault()，這樣它就不會(huì)自動(dòng)“發(fā)布”表單）。

然后，e.currentTarget您將可以訪問表單內(nèi)的所有元素。

const Test = () => {

  const onFormSubmit = (e) => {

    e.preventDefault();

    e.stopPropagation();

    const formData = new FormData(e.currentTarget);

    for (let [name, value] of formData.entries()) {

      /* makePost function here or something */

      console.log(name + ":" + value);

    }

  }

  return (

    <form onSubmit={onFormSubmit}>

    <div className="input-group mb-3">  

        <input type="text" className="form-control" name={"id_maybe"} placeholder="add a post"/>

        <div class="input-group-append">

              <button type="submit" class="btn btn-primary">Post</button>

         </div>                    

    </div>

    </form>

  );

}


ReactDOM.render(<Test />, document.getElementById("root"));

<div id="root"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.4/umd/react.production.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.4/umd/react-dom.production.min.js"></script>


查看完整回答
反對(duì) 回復(fù) 2023-09-07
?
躍然一笑

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

我想這就是你要找的


import React, { useState } from "react";

import "./style.css";


export default function App() {

? const [value, setValue] = useState("");

? const [posts, setPosts] = useState([]);

? const onSubmit = () => {

? ? posts.push(value);

? ? setPosts([...posts]);

? ? setValue("");

? };


? const handleInput = e => {

? ? setValue(e.target.value);

? };

? return (

? ? <div className="input-group mb-3">

? ? ? <input

? ? ? ? type="text"

? ? ? ? className="form-control"

? ? ? ? placeholder="add a post"

? ? ? ? value={value}

? ? ? ? onChange={handleInput}

? ? ? />

? ? ? <div class="input-group-append">

? ? ? ? <button class="btn btn-primary" onClick={onSubmit}>

? ? ? ? ? Add Post

? ? ? ? </button>

? ? ? </div>


? ? ? {posts.map(post => (

? ? ? ? <div>{post}</div>

? ? ? ))}

? ? </div>

? );

}


查看完整回答
反對(duì) 回復(fù) 2023-09-07
?
炎炎設(shè)計(jì)

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

我認(rèn)為你的做法不對(duì)。恕我直言，您的代碼相當(dāng)草率。首先，你沒有<form>元素。其次，你這樣做的方式很奇怪。您無需使用單獨(dú)的函數(shù)，而是直接將箭頭函數(shù)插入到 中button。

您還應(yīng)該使用State并將其添加到構(gòu)造函數(shù)中：

this.state = {

? items: [],

? text: ""

}

this.handleChange = this.handleChange.bind(this);

this.handleSubmit = this.handleSubmit.bind(this);

首先，handleChange在這里添加一個(gè)按鈕：


handleChange(event) {

? this.setState({ text: event.target.value });

}

您可以在提交功能中使用類似的內(nèi)容：


handleSubmit(event) {

? event.preventDefault();

? const newItem = {

? ? text: this.state.text,

? ? id: performance.now()

? };

? this.setState(state => ({

? ? items: state.items.concat(newItem),,

? ? text: ""

? }));

}

在渲染函數(shù)中更改此設(shè)置：


<form>

? ? <input type="text" className="form-control" onChange= {this.handleChange} value={this.state.text} placeholder="add a post"/>

? ? ? ? <div class="input-group-append">

? ? ? ? ? ? ? <button type="submit" class="btn btn-primary" onClick={this.handleSubmit}>Post</button>

? ? ? ? ?</div>

</form>


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

添加回答

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