V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
15651980765
V2EX  ›  React

看 React 文档,有一句话不太理解。

  •  
  •   15651980765 · 2020-01-10 10:42:47 +08:00 · 2935 次点击
    这是一个创建于 1776 天前的主题,其中的信息可能已经有所发展或是发生改变。

    “尽管 this.props 和 this.state 是 React 本身设置的,且都拥有特殊的含义,但是其实你可以向 class 中随意添加不参与数据流(比如计时器 ID )的额外字段。”


    组件之间流转的数据在 this.props 上,组件内部的数据在 this.state 上,那什么数据直接添加到 this 上呢?

    7 条回复    2020-04-03 11:32:15 +08:00
    iiii
        1
    iiii  
       2020-01-10 10:56:18 +08:00 via Android
    render 里用不到的
    ljpCN
        2
    ljpCN  
       2020-01-10 10:58:08 +08:00 via Android
    这段话已经举例了。比如一个计时器的 ID(setTimeout 的返回值)你需要保存起来(万一需要 clear 掉),这时你就把它挂到 class 的 this 上
    yaphets666
        3
    yaphets666  
       2020-01-10 11:00:18 +08:00
    不需要响应式变化的数据 暂时可以这么理解
    shadeofgod
        4
    shadeofgod  
       2020-01-10 11:04:44 +08:00
    不希望它的更新导致 re-render 的都可以放,常用的比如:

    ```js
    componentDidMount() { this._mount = true }
    componentWillUnmount() { this._mount = false }
    ```
    nnnToTnnn
        5
    nnnToTnnn  
       2020-02-11 10:51:39 +08:00
    React 是单项数据流。

    通过 Props 和 state 来进行状态更改组件的变化。 但是有些属性是不需要在 Props 以及 state 进行变化的。

    例如计算用户点击了多少次。 这些本身不参与 dom 的变化。所以基本上不需要用到 state,props

    -------------------------

    其实这也是我和同事的之间经常吵的一件事情。

    我不喜欢作为单向数据流,也就是不喜欢以数据为基础来进行渲染。更加喜欢的是以 dom 作为一个组件对象。拥有事件属性,作为一个对象来进行操作。
    lianjp
        6
    lianjp  
       2020-04-02 15:20:00 +08:00
    最近面试还被面试官问到过这个问题,问:和视图没有关系的变量应该写在哪里?答:直接用 this 挂在实例上。
    15651980765
        7
    15651980765  
    OP
       2020-04-03 11:32:15 +08:00
    @lianjp 后面用函数组件之后又在纳闷,与视图无关的变量定义在哪里,是不是用 useRef 呢,通过操作 ref.current 来控制变量?
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3250 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 12:28 · PVG 20:28 · LAX 04:28 · JFK 07:28
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.