forked from ddrilling/asb_cloud_front
CF2-7: Переменная со стрелками убывания/роста сохранена в Ref
This commit is contained in:
parent
bb0b3527b3
commit
0dda9c417b
@ -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)=>{
|
||||||
|
Loading…
Reference in New Issue
Block a user