The most important concept of any react-native (and react for that matter) app is the concept of component.
What you want is to make a component "Question" that can receive via props the question's title and its possible answers. This way you can avoid repeating code when making different questions. I'll let you play with the inner implementation, should be easy enough searching for examples using checkboxes and labels.
Then, from your root component (or the component where you want to display these questions), you instance two of these Question with the respective data. This would look something like:
const App = () => {
return (
<View>
<Question
title="What pet do you prefer?"
answers=[
"A dog",
"A cat"
]
/>
<Question
title="What color do you want your pet to be?"
answers=[
"red",
"green"
]
/>
</View>
)
}
You can also add a button so that clicking it shows the corresponding image.
Finally, what you will need is to have the answers available in your root component, so that you can get the image via a request or however you were going to get it. After that, you just need to use it.
To do this, I defined state within the App component, I passed props to several components, and used some defined react native components. You should read about all of these in react native's docs, which are pretty good.
Here is the example:
const App = () => {
const [state, setState] = useState({})
const [image, setImage] = useState(null)
// This is useful for changing this component's state from within the children
const changeAnswer = ({question, answer}) => {
setState({...state, question: answer})
}
const getImage = async () => {
const { data } = await apiCall(state) // Or however you were going to get the image
setImage(data.image)
}
return (
<View>
<Question
changeAnswer={changeAnswer}
title="What pet do you prefer?"
answers=[
"A dog",
"A cat"
]
/>
<Question
changeAnswer={changeAnswer}
title="What color do you want your pet to be?"
answers=[
"red",
"green"
]
/>
<Button
title="Show image!"
onPress={getImage}
/>
{image &&
<Image src={image} />
}
</View>
)
}
Try to experiment and see where it gets you and what you can learn! The most important part when learning a new technology is to experiment.
Just out of curiosity, are you using expo to run your react native app?