小编Mat*_*san的帖子

如何在React Hooks中使用shouldComponentUpdate?

我一直在阅读以下链接:
https : //reactjs.org/docs/hooks-faq.html#how-do-i-implement-shouldcomponentupdate
https://reactjs.org/blog/2018/10/23/react -v-16-6.html

在第一个链接中显示为(https://reactjs.org/docs/hooks-faq.html#from-classes-to-hooks):

shouldComponentUpdate:请参见React.memo

第二个链接还指出:

当使用PureComponent或shouldComponentUpdate输入类相同时,类组件可以免于渲染。现在,您可以通过将功能组件包装在React.memo中来对它们进行相同的操作。


需要什么:

我希望Modal仅在可见Modal时呈现(由this.props.show管理)

对于类组件:

shouldComponentUpdate(nextProps, nextState) {
    return nextProps.show !== this.props.show;
}
Run Code Online (Sandbox Code Playgroud)

我该如何memo在功能组件中使用-在这里,在Modal.jsx中?


相关代码:

功能组件Modal.jsx(我不知道如何检查props.show)



import React, { useEffect } from 'react';
import styles from './Modal.module.css';
import BackDrop from '../BackDrop/BackDrop';

const Modal = React.memo(props => {
  useEffect(() => console.log('it did update'));

  return (
    <React.Fragment>
      <BackDrop show={props.show} clicked={props.modalClosed} />
      <div
        className={styles.Modal}
        style={{
          transform: props.show ? 'translateY(0)' : 'translateY(-100vh)',
          opacity: props.show ? '1' : '0'
        }}>
        {props.children}
      </div>
    </React.Fragment> …
Run Code Online (Sandbox Code Playgroud)

javascript functional-programming reactjs react-hooks

4
推荐指数
2
解决办法
3612
查看次数

无法读取未定义的属性“isLoggedIn”

此代码用于添加产品,然后在后端使用 mongodb 创建 pdf 的购物车和订单。实际上 session.isLoggedIn 是在 auth js 检查代码中定义的,但仍然在 app.js 中它给出了这个错误!

app.JS 代码

const path = require('path');

const express = require('express');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');
const session = require('express-session');
const MongoDBStore = require('connect-mongodb-session')(session);
const csrf = require('csurf');
const flash = require('connect-flash');
const multer = require('multer');

const errorController = require('./controllers/error');
const User = require('./models/user');

const MONGODB_URI =
  'mongodb....url';

const app = express();
const store = new MongoDBStore({
  uri: MONGODB_URI,
  collection: 'sessions'
});
const csrfProtection = csrf(); …
Run Code Online (Sandbox Code Playgroud)

javascript csrf node.js express multer

2
推荐指数
1
解决办法
2180
查看次数