Question

我是新手做出反应，而我想知道的是如何避免某些组件的服务器渲染。这是我的代码：

export default class PrTopBanner extends React.Component {
   constructor(props) {
     super(props);
     this.isTextVisible = false;
   }

   componentDidMount() {
    this.isTextVisible = true;
   }

   getContent() {
     return (
       <div>
         <a className={classNames(cssClasses.textWrapper, {
            'textVisible': this.isTextVisible})}
         </a>
       </div>
     );
   }    
}

文本内容不可见，并在componentDidMount（）中淡出，因此如何避免我的文本代码不会有服务器呈现。

Answer 1

几个问题 - 你需要调用render（）而不是getContent（）是一个。这有效：

＆＃13;

class PrTopBanner extends React.Component {
   constructor(props) {
     super(props);
     this.isTextVisible = false;
   }

   componentDidMount() {
    this.isTextVisible = true;
   }

   render() {
     return (
       <div>
         <a className='test'>test
         </a>
       </div>
     );
   }    
}

ReactDOM.render(<PrTopBanner />, document.querySelector('#container'));

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id="container">
</div>

＆＃13;

如何在React中避免服务器渲染某些组件？

1 个答案: