0

Ich versuche, Native-Base-Optionsfelder zu verwenden. Ich habe etwas zusätzlichen Code hinzugefügt, um Radio-Buttons funktionieren zu lassen. Während es immer noch nicht funktioniert. Hier ist der Code:Optionsfelder funktionieren nicht auf ios

import React, { Component } from 'react'; 
import { Container, Header, Content, ListItem, Text, Radio, Right } from 'native-base'; 
export default class RadioButtonExample extends Component { 
constructor() { 
    super(); 
    this.state = { 
    itemSelected: 'itemOne', 
} 
} 
render() { 
return (
    <Container> 
     <Header /> 
     <Content> 
     <ListItem> 
      <Text>Daily Stand Up</Text> 
      <Right> 
      <Radio onPress={() => this.setState({ itemSelected: 'itemOne' })} 
       selected={this.state.itemSelected == 'itemOne'} 
      /> 
      </Right> 
     </ListItem> 
     <ListItem> 
      <Text>Discussion with Client</Text> 
      <Right> 
      <Radio onPress={() => this.setState({ itemSelected: 'itemTwo' })} 
        selected={this.state.itemSelected == 'itemTwo' } 
       /> 
      </Right> 
     </ListItem> 
     </Content> 
    </Container> 
    ); 
    } 
} 

Wie kann dieser Code behoben werden? Was ist los mit dir?

Antwort

0

Behandeln Sie das onPress Ereignis in der ListItem

import React, { Component } from "react"; 
import { Container, Header, Content, ListItem, Text, Radio, Right } from "native-base"; 

export default class RadioButtonExample extends Component { 

    constructor() { 
    super(); 
    this.state = { 
     itemSelected: "itemOne", 
    }; 
    } 

    render() { 
    return (
     <Container> 
     <Header /> 
     <Content> 
      <ListItem onPress={() => this.setState({ itemSelected: "itemOne" })}> 
      <Text>Daily Stand Up</Text> 
      <Right> 
       <Radio selected={this.state.itemSelected == "itemOne"} /> 
      </Right> 
      </ListItem> 
      <ListItem onPress={() => this.setState({ itemSelected: "itemTwo" })}> 
      <Text>Discussion with Client</Text> 
      <Right> 
       <Radio selected={this.state.itemSelected == "itemTwo"} /> 
      </Right> 
      </ListItem> 
     </Content> 
     </Container> 
    ); 
    } 
} 
+0

Vielen Dank für die Beantwortung. Das Problem mit diesem Code ist, dass beim Ausführen einer App beide Optionsfelder deaktiviert sind, während standardmäßig die erste aktiviert sein sollte. –

+0

@NewTechLover hast du eine Lösung dafür gefunden? –

Verwandte Themen