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

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

React 中如何從子元素到姊妹元素的值?JSX

React 中如何從子元素到姊妹元素的值?JSX

SMILET 2021-06-05 18:09:29
我正在從下拉日期選擇器中獲取一個日期并嘗試在另一個頁面中使用它,以便我可以交叉參考開放預訂的時間。當 Datepicker 選擇一個日期,并且在 Btnsearch 上設置了 props 值時,它嘗試重定向并且似乎確實重新渲染,但是當 wasSubmit 更改為 true 時,prop 值未定義。我從哪里拉這個道具?我添加了我認為是路由器的東西,我用屬性設置了狀態(tài),this.state.value但這似乎沒有解決問題。這是我的日期選擇器、Btnsearch、Bookingpageimport "./Btnsearch/Btnsearch";// react plugin used to create datetimepickerimport ReactDatetime from "react-datetime";import { Redirect } from 'react-router-dom';import Bookingpage from "./Bookingpage/Bookingpage";// reactstrap componentsimport {  FormGroup,  InputGroupAddon,  InputGroupText,  InputGroup,  Col,  Row} from "reactstrap";import Btnsearch from "./Btnsearch/Btnsearch";class Datepicker extends React.Component {  constructor(props) {    super(props);    this.state = {      value: ""    };    //this.handleChange = this.handleChange.bind(this);    this.handleSubmit = this.handleSubmit.bind(this);  }  handleSubmit = event => {    event.preventDefault();    this.setState({wasSubmitted: true});}render() {    const { value, wasSubmitted } = this.state;    if (wasSubmitted) {        return <Bookingpage><Redirect value={this.state.value} to='./Bookingpage/Bookingpage' /></Bookingpage>    } else {      return (        <>          <FormGroup>            <InputGroup className="input-group-alternative">              <InputGroupAddon addonType="prepend">                <InputGroupText                >                  <i className="ni ni-calendar-grid-58" />                </InputGroupText>              </InputGroupAddon>              <ReactDatetime              value={this.state.value}              onChange={this.handleChange}              inputProps={{                placeholder: "Date Picker Here"              }}              timeFormat={false}              />            </InputGroup>          </FormGroup>          <form onSubmit={this.handleSubmit}>          <Btnsearch  type="submit" value={this.state.value}/>          </form>        </>      );    }  }}完整的項目在這里https://react-puh2oq.stackblitz.io
查看完整描述

1 回答

?
萬千封印

TA貢獻1891條經(jīng)驗 獲得超3個贊

我沒有看到 handleChange 函數(shù)。


因此,似乎像你選擇一個日期,但不是.setState()的this.state.value。


? ? ? ? ? ? <ReactDatetime

? ? ? ? ? ? ? value={this.state.value}

// HERE YOU CALL IT, BUT handleChange DOESN'T EXIST.

? ? ? ? ? ? ? onChange={this.handleChange}?

? ? ? ? ? ? ? inputProps={{

? ? ? ? ? ? ? ? placeholder: "Date Picker Here"

? ? ? ? ? ? ? }}

? ? ? ? ? ? ? timeFormat={false}

? ? ? ? ? ? ?/>

好吧,一個合適的 handleChange 函數(shù)可能是這樣的:


.

.

.

? handleSubmit = event => {

? ? event.preventDefault();

? ? this.setState({wasSubmitted: true});

}


handleChange = e => {

? ? e.preventDefault();

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

}



render() {

? ? const { value, wasSubmitted } = this.state;


? ? if (wasSubmitted) {

? ? ? ? return <Bookingpage><Redirect value={this.state.value} to='./Bookingpage/Bookingpage' /></Bookingpage>

? ? } else {

.

.

.

handleSubmit只要您使用粗箭頭語法,您就不必 .bind() 或此函數(shù)。


查看完整回答
反對 回復 2021-06-18
  • 1 回答
  • 0 關注
  • 137 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網(wǎng)微信公眾號