我最近在面试中被问到这个问题，我无法回答。
我的问题是：
考虑下面的代码片段，其中包含两个按钮和一个文本

import { Text, StyleSheet, View, Button } from 'react-native';

let a = 0;

const incrementA = () => {
  console.log(`a => ${a}`);
  a += 1;
  console.log(`a = ${a}`);
};

export default function App() {
  let b = 0;

  const incrementB = () => {
    console.log(`b => ${b}`);
    b += 1;
    console.log(`b = ${b}`);
  };

  return (
    <View style={styles.container}>
      <View>
        <Text>{a}</Text>
        <Button title="Increment a" onPress={incrementA} />
      </View>
      <View>
        <Text>{b}</Text>
        <Button title="Increment b" onPress={incrementB} />
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
  },
});

我被问到的是，在点击任何按钮，什么将在屏幕上的输出，在点击“增量a”按钮，它会更新屏幕上的a的值，同样的“增量b”按钮.
在给出错误的答案后，他告诉我，“a”的值将重新返回，但b的值不会。他还给了我useState的例子，它返回一个包含两个值的数组，第一个是值本身，第二个是setter函数来更新这个值，这里setter函数是从组件调用的，但存在于组件之外，所以他的结论是，如果我们更新组件之外的值，那么它将重新呈现，否则它不会。
我无法创建与下面提供的小吃相同，可以有人请解释这个完整的场景。
以下是我为测试它而创建的零食：https://snack.expo.dev/@jdarshan1210/gnarly-red-french-fries