Uso inteligente de propiedades dinámicas de deconstrucción en react

1. ESLintCualquiera que haya utilizado el complemento sabe que Vscodesi no necesita deconstruir el valor, le recomendará que utilice la asignación de deconstrucción.
2. En el proyecto, 对象解构el método más común que utilizo con más frecuencia es.
3. Este método de escritura es muy básico y todos los valores se pueden escribir así. De esta forma, la forma más sencilla de escribir es conforme a la react官方建议的写法和符合ESLintespecificación.

从this.state、this.props中取值
 const listType = this.state.listType; // 一般写法

 const {
    
     listType,fileList,downloadTitle } = this.state;

 const {
    
     dispatch, registrationId } = this.props;

4 、

Deconstruir propiedades dinámicas

Ahora 对象解构中使用变量, puede facilitar la operación de asignación de valor.
Escribe el valor de la variable en []

 const {
    
     [listType]: {
    
     infoList } } = this.props;

El escenario de la aplicación también es muy simple de pensar,

  • Puede controlar las variables de acuerdo con la situación, controlar de infoListdónde obtiene los valores y realizar escenarios más complejos.
    Lo dispatchmismo se puede utilizar en
    const {
    
     keyword, typeId, state, listType } = this.state;
    dispatch({
    
    
      type: `${
      
      listType}/getApplicationPageList`,
      payload: {
    
    
      .......

6. Sencillo y sencillo de compartir. Por favor corríjame si hay algún lugar inadecuado.
Inserte la descripción de la imagen aquí

Supongo que te gusta

Origin blog.csdn.net/weixin_45416217/article/details/108417805
Recomendado
Clasificación