react实现计算属性

react没有像vue那样间接封装一个computer计算属性，然而他有本人得实现形式，辨别是class组件还是function组件

class组件

• 通过class得get办法，能够依赖于props或者state

class Demo extends React.Component {    constructor(props) {        super(props)        this.state = {            count: 1        }    }    get otherCount() {        return this.state.count + 1    }    render() {        return <div>{this.otherCount}</div>    }}

• 间接在render办法外面写，因为state和props的扭转会触发render的执行

class Demo extends React.Component {    constructor(props) {        super(props)        this.state = {            count: 1        }    }    render() {        return <div>{this.state.count + 1}</div>    }}

function组件

function组件能够应用useMemo

import React, { useState, useMemo } from 'react';function Demo() {  const [count, setCount] = useState(0);  const double = useMemo(() => {    return count * 2;  }, [count])  return (    <div>      {double}    </div>  )}