CF2-7: Переменная со стрелками убывания/роста сохранена в Ref

This commit is contained in:
KharchenkoVV 2021-05-27 17:55:03 +05:00
parent bb0b3527b3
commit 0dda9c417b

View File

@ -1,11 +1,10 @@
import { useState, useEffect } from 'react'; import { useState, useEffect, useRef } from 'react';
import {CaretUpOutlined, CaretDownOutlined} from '@ant-design/icons' import {CaretUpOutlined, CaretDownOutlined} from '@ant-design/icons'
export const ValueDisplay = ({prefix, value, suffix, isArrowVisible}) =>{ export const ValueDisplay = ({prefix, value, suffix, isArrowVisible}) =>{
const [oldVal, setOldVal] = useState(NaN) const [oldVal, setOldVal] = useState(NaN)
const [val, setVal] = useState('---') const [val, setVal] = useState('---')
const arrowRef = useRef(null);
let arrow = null
useEffect(()=>{ useEffect(()=>{
if(value) if(value)
@ -14,16 +13,16 @@ export const ValueDisplay = ({prefix, value, suffix, isArrowVisible}) =>{
if (isArrowVisible) if (isArrowVisible)
{ {
if (value > oldVal) if (value > oldVal)
arrow = <CaretUpOutlined style={{color:"red"}} /> arrowRef.current = (<CaretUpOutlined style={{color:"red"}} />)
else if (value < oldVal) else if (value < oldVal)
arrow = <CaretDownOutlined style={{color:"red"}} /> arrowRef.current = (<CaretDownOutlined style={{color:"red"}} />)
setOldVal(value) setOldVal(value)
} }
} else } else
setVal(value) setVal(value)
},[value]) },[value])
return(<span className='display_value'>{prefix} {val} {suffix}{arrow}</span>) return(<span className='display_value'>{prefix} {val} {suffix}{arrowRef.current}</span>)
} }
export const Display = (props)=>{ export const Display = (props)=>{