更改状态时,仅会渲染使用该状态的组件,还是会渲染同一级别的所有组件?

时间:2020-11-09 10:24:40

标签: reactjs react-native

就像我的问题一样,当仅组件状态改变时,react native或react是自动计算渲染。像例子

import React, { Component } from 'react';

import './Offer.scss';

import Modal from '../../common/Modal/Modal';

class Offer extends Component {
  state = {
    showModal: false,
  };

  openModal = () => {
    this.setState({ showModal: true });
    console.log('modal');
  };
  closeModal = () => {
    this.setState({ showModal: false });
  };
  render() {
    const { showModal } = this.state;
    return (
      <section className='Offer'>
        <div className='Offer__Container'>
          <div className='Offer__Content'>
            <div className='Offer__Content-text'>
              <h3>Tadeusz</h3>
              <p>
                Wreszcie po całym domu dawne obyczaje swe rodzinne duszę
                utęsknioną
              </p>
              <button
                onClick={() => this.openModal()}
                className='btn btn-offer'>
                Więcej
              </button>
            </div>
            <Modal show={showModal} close={() => this.closeModal()} />
          </div>
        </section>
    );
  }
}

export default Offer;

设置状态编号时,仅按钮编号被重新呈现,或者所有组件在平面列表中被重新包含按钮

1 个答案:

答案 0 :(得分:0)

如果组件状态发生变化,所有组件将再次重新呈现。