回答native：当我单击另一个页面上的按钮时，如何更改视图？

debugcn 发表于 Dev

大

我想在SafeAreaView另一页上按下按钮时再次更改样式，以便再次返回的旧样式SafeAreaView。我希望得到一些帮助。

这是Reshima页面

function Reshima({ paramsList = { list: [] } }) {


return (
      <SafeAreaView style={styles.flat}>
        <FlatList
          data={filteredList}
          renderItem={({ item, index }) => renderItem({ index, item })}
          keyExtractor={(item) => item.Water_Source_Code.toString()}
          ListEmptyComponent={EmptyListMessage}
        />
      </SafeAreaView>
)}

这是AppNavigator按钮的页面：

const HomeStack = () => {

<TouchableOpacity onPress={() => {
                  dispatch(setFilterViewVisible(true));
                }}>
                  <Icon
                    color="white"
                    style={styles.homeIcon}
                    name={
                      Platform.OS === 'android'
                        ? 'md-search-outline'
                        : 'md-search-outline'
                    }
                    size={30}
                  />
                </TouchableOpacity>
}

Ashwith Saldanha

onPress函数将提供一个道具，该道具给出相应的ToggleButton Pressed的索引，如果按下第一个按钮，则它给出0，否则给出1，则可以切换视图，

这是一个例子：https : //snack.expo.io/@ashwith00/humiliated-bacon


const select_radio_props = [
  { label: 'first', value: 0 },
  { label: 'second', value: 1 },
];

export default () => {
  const [value1, onChangeText1] = React.useState('');
  const [value2, onChangeText2] = React.useState('');
  const [value3, onChangeText3] = React.useState('');
  const [initialRadioForm, setInitialRadioForm] = useState(0);
  const [visible, setVisible] = useState(false);

  return (
    <>
      <ScrollView
        behavior={Platform.OS == 'ios' ? 'padding' : 'height'}
        style={styles.container}>
        <View style={styles.MainScreen}>
          <View style={styles.WhereToCheckTextView}>
            <Text style={styles.WhereToCheckText}>where</Text>
          </View>
          <View style={styles.RadioFormView}>
            <RadioForm
              formHorizontal={true}
              selectedButtonColor="black"
              buttonColor={'black'}
              animation={true}
              labelHorizontal={true}
              labelStyle={{
                fontSize: 18,
                left: 5,
                color: 'black',
              }}
              buttonSize={20}
              radio_props={select_radio_props}
              initial={initialRadioForm}
              onPress={(val) => {
                setVisible(val === 1);
              }}
            />
          </View>
          {visible && (
            <View style={{ width: 200, height: 100, backgroundColor: 'red' }} />
          )}
        </View>
      </ScrollView>
    </>
  );
};

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。