React Native setState Flickering

I have something very simple to do, which I have done before, and now doesn't seem to work. I just need a number to go up once every second and then display it.Here is my code:

const counter = () => {    let i: number = 0    setInterval(() => {        i += 1    }, 1000)    const [number, setNumber] = useState(0)    setInterval(() => { setNumber(i) }, 1000)    return (<Text>{number}</Text>    )}

This is very simple and yet doesn't work. What happens is that the number flickers, going between numbers up and down as it slowly climbs up the number line. It's... not great