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

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

如何使用 setState？

如何使用 setState？

qq_花開(kāi)花謝_0 2022-10-13 19:25:22
if (this.props.showFiltersHeader) {            const { tipoBusqueda } = this.props;            if (tipoBusqueda === '1')                this.setState({ filterFacturaNieType: 'N'});            else if (tipoBusqueda === '2')                this.setState({ filterFacturaNieType: 'F'});                        return <div>                <div className="search-container">                    <p>Buscar por NIE o Factura</p>                    <div className="caja-select">                        <select onChange={this.onChangeSelect} name="filterFacturaNieType" value={this.state.filterFacturaNieType}>                        <option value='N'>NIE</option>                        <option value='F'>Factura</option>                        </select>                    </div>                    <span className="alert-span">{this.state.errors["filterFacturaNieType"]}</span>                </div>....}你為什么不使用 setState ？，總是選擇第一個(gè)選項(xiàng)
查看完整描述

1 回答

?
開(kāi)心每一天1111

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

如果您想根據(jù) 的值為您的狀態(tài)定義一個(gè)默認(rèn)值tipoBusqueda，您可以在 a useEffect、 componentDidMount 甚至在類(lèi)構(gòu)造函數(shù)中進(jìn)行。由于您使用的是類(lèi)組件，因此這應(yīng)該可以解決問(wèn)題：


componentDidMount() {

  this.setDefaultValue()

}



setDefaultValue() {

  const { tipoBusqueda } = this.props;


  if (tipoBusqueda === '1')

    this.setState({ filterFacturaNieType: 'N' });

  else if (tipoBusqueda === '2')

    this.setState({ filterFacturaNieType: 'F' });  

}

你不應(yīng)該在你的render方法中這樣做，因?yàn)槟銜?huì)導(dǎo)致一個(gè)無(wú)限循環(huán)。您的 setState 將再次調(diào)用您的渲染方法，然后您將再次調(diào)用 setState。


componentDidMount 只會(huì)在組件掛載后執(zhí)行一次，不再執(zhí)行。從 React 16.8 開(kāi)始，您可以在功能組件中使用鉤子來(lái)獲得狀態(tài)，因此我建議您將類(lèi)組件更改為功能組件。你可以這樣做：


import React, { useEffect, useState } from 'react'


const Component = ({ tipoBusqueda, showFiltersHeader }) => {

  const [filterFacturaNieType, setFilterFacturaNieType] = useState('')


  useEffect(() => {

    if (tipoBusqueda === '1')

      setFilterFacturaNieType('N');

    else if (tipoBusqueda === '2')

      setFilterFacturaNieType('F');

  }, [])


  if (showFiltersHeader) {

    return (

      <div className="search-container">

        <p>Buscar por NIE o Factura</p>

        <div className="caja-select">

          <select onChange={e => setFilterFacturaNieType(e.target.value)} name="filterFacturaNieType" value={filterFacturaNieType}>

            <option value='N'>NIE</option>

            <option value='F'>Factura</option>

          </select>

        </div>

      </div>

    )

  }


  return null

}


export default Component

您甚至可以將數(shù)字映射到字母，這樣就可以避免不必要地調(diào)用 setState：


const numberToLetter = {

  1: 'N',

  2: 'F'

}

然后，在構(gòu)造函數(shù)或 useState 上使用它。


// in a class component

constructor(props) {

  super(props)


  this.state = {

    filterFacturaNieType: numberToLetter[props.tipoBusqueda]

  }

}


// or 


state = {

  filterFacturaNieType: numberToLetter[this.props.tipoBusqueda]

}


// or in a functional component, using the useState:

const [filterFacturaNieType, setFilterFacturaNieType] = useState(numberToLetter[tipoBusqueda])


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

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

 幫助反饋 APP下載

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

 公眾號(hào)

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