Reactjs 数据更改时如何呈现子函数组件？

导入函数组件B时，

onChange

或

onComplete

可以在数据仅在B中更改时重新呈现B

B:

但我的问题是，如果我只在A中单击

，我可以看到

控制台.log（'lightValue is'，lightValue）在B中更改，但
不会重新渲染

我尝试将布尔属性从a发送到B，并设置类似于forceUpdate的内容，但这会导致重新渲染出现很多错误

我不知道如何实现它，有什么想法吗？谢谢。
我认为您的问题是在这两个组件中使用了不同的状态。
所以你实际上引用了两个不同的状态

我会将所有状态提升到A，并使用B作为子组件。像这样的

B

const B=（道具）=>{
常量{亮度，正确性}=道具；
console.log（'lightValue为'，亮度）；
返回(
正确性（值）}
onComplete={（值）=>setBrightness（值）}
{…其他道具}
/>
);
}

A

从“/B”导入B；
常数A=（）=>{
const[亮度，亮度]=使用状态（0）//
返回(
显示值为{亮度}
{
如果（某些条件）{
正确性（50）；
}否则{
正确性（0）；
}
}}
/>
);

我们在这里所做的是在父组件中声明一个状态。无论子级还是父级更改此状态，所有相关组件都会自动更新

让我知道它是否有效。
这样我甚至不需要使用回电，它更容易使用。感谢您的帮助。在这里，您将把setBrightness作为一个函数传递给子组件。因此，当子函数使用值调用函数时，它会设置状态。
const B = (props) => {
  const { lightValue } = props;
  console.log('lightValue is', lightValue);
  const [brightness, setBrightness] = useState(lightValue);

  const returnLightValue = (value) => {
    props.callBack(value);
  };

  return (
    <VerticalSlider
      value={brightness}
      onChange={(value) => returnLightValue(value)}
      onComplete={(value) => {
        returnLightValue(value);
        setBrightness(value);
      }}
      {...other props}
    />
  );
}

import B from './B';

const A = () => {
  const [brightness, setBrightness] = useState(0); //

  return (
    <View>
      <Text>Show the value is {brightness}</Text>
      <B
        lightValue={brightness}
        callBack={(value) => setBrightness(value)}
      />
      <Button 
        onPress={() => {
          if (someCondition) {
            setBrightness(50);
          } else {
            setBrightness(0);
          }
        }}
      />
    </View>
  );

const B = (props) => {
const { brightness, setBrightness } = props;
console.log('lightValue is', brightness);

 return (
    <VerticalSlider
      value={brightness}
      onChange={(value) => setBrightness(value)}
      onComplete={(value) => setBrightness(value)}
      {...other props}
    />
  );
}

import B from './B';

const A = () => {
  const [brightness, setBrightness] = useState(0); //

  return (
    <View>
      <Text>Show the value is {brightness}</Text>
      <B
        brightness={brightness}
        setBrightness={setBrightness}
      />
      <Button 
        onPress={() => {
          if (someCondition) {
            setBrightness(50);
          } else {
            setBrightness(0);
          }
        }}
      />
    </View>
  );